什么是使用jQuery创建HTML元素并将侦听器绑定到它的推荐方法?

Lam*_*bda 1 javascript jquery dom javascript-events

目前,我使用以下内容实现此目的:

var myElem = "<tr id='tr-1'><td>content</td></tr>";
$("#myTable").append(myElem);
$("#tr-1").click(function() {
  // blah blah
});
Run Code Online (Sandbox Code Playgroud)

传统上,当我不使用jQuery时,我曾经做过这样的事情:

var myElem = document.createElement(...);
var myTable = document.getElementById("myTable");
myTable.appendChild(myElem);
myElem.onclick = function() {
  // blah blah
}
Run Code Online (Sandbox Code Playgroud)

问题是,在第二种方法中我已经有了一个参考myElem,我不必扫描DOM($("#tr-1"))来找到它,就像jQuery方法一样,因此它应该更快,特别是在大页面中.是不是有更好的jQuery-ish方法来完成这项任务?

Nic*_*ver 8

你可以将它缩小/加速它有点像这样:

$("<tr id='tr-1'><td>content</td></tr>").click(function() {
 // blah blah
}).appendTo("#myTable");
Run Code Online (Sandbox Code Playgroud)

这样就不需要找到元素,而且在实际调用之前你还要处理一个文档片段.appendTo(),这样可以更快地完成DOM操作.

还有$(html, props)自1.4以来的版本对你的例子不太适用,但在你可能想要查看的某些情况下甚至更简洁.