在JQuery中创建函数以避免再次编写相同的代码

Question

我目前使用的Twitch API接收关于特定通道的信息，然后将其预加载到HTML文档中。预先反映信息的代码被反复使用。我想知道你是如何创建一个可以避免重复并在整个文档中被调用的函数？

的codepen可以在这里找到：http://codepen.io/sibraza/pen/AXRRvq

这里是jQuery代码这就是被反复使用：

$("#follower-Info").prepend("<div class ='row'>" + "<div class = 'col-md-4'>" + "<img src='" + logo + "'>" + "</div>" + "<div class='col-md-4'>" + name +"</div>"+ "<div class ='col-md-4'>" + status + "</div></div>") 

会是这样的工作：

function addThis(){ 

     $("#follower-Info").prepend("<div class ='row'>" + "<div class = 'col-md-4'>" + "<img src='" + logo + "'>" + "</div>" + "<div class='col-md-4'>" + name +"</div>"+ "<div class ='col-md-4'>" + status + "</div></div>") 

    } 

，然后我可以可以在每个$ .getJSON请求之后调用addThis（）。

Answer 1

它会工作，但您需要通过name,logo和status作为函数的参数。您还可以删除多余的字符串连接：

function addThis(name, logo, status) { 
    $("#follower-Info").prepend('<div class="row"><div class="col-md-4"><img src="' + logo + '"></div><div class="col-md-4">' + name + '</div><div class="col-md-4">' + status + '</div></div>'); 
} 

那么您可以在$.getJSON处理程序内调用它：

addThis('Foo', 'bar.jpg', 'online');