Javascript 什么'；使用jQuery创建HTML元素并将侦听器绑定到该元素的推荐方法是什么？

目前，我通过以下方式实现了这一点：

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

var myElem = document.createElement(...);
var myTable = document.getElementById("myTable");
myTable.appendChild(myElem);
myElem.onclick = function() {
  // blah blah
}

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

---

问题是，在第二种方法中，我已经引用了

myElem

，我不必像jQuery方法一样扫描DOM（

$（“#tr-1”）

）来找到它，因此它应该更快，尤其是在大页面中。有没有更好的jQuery-ish方法来完成此任务？

您可以将其缩小/加快，如下所示：

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

var myElem = document.createElement(...);
var myTable = document.getElementById("myTable");
myTable.appendChild(myElem);
myElem.onclick = function() {
  // blah blah
}

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

$（“内容”）。单击（函数（）{
//废话
}).附于（“#我的表格”）；

这就不需要查找元素，而且在实际调用之前，您需要处理文档片段，这使得执行DOM操作的速度更快

---

还有一个1.4版之后的版本对您的示例不太适用，但在某些情况下，您可能想查看它，它甚至更简洁。

您可以将其缩小/加快，如下所示：

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

var myElem = document.createElement(...);
var myTable = document.getElementById("myTable");
myTable.appendChild(myElem);
myElem.onclick = function() {
  // blah blah
}

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

$（“内容”）。单击（函数（）{
//废话
}).附于（“#我的表格”）；

这就不需要查找元素，而且在实际调用之前，您需要处理文档片段，这使得执行DOM操作的速度更快

还有一个1.4版以后的版本对您的示例不太适用，但在某些情况下，您可能想查看它，它甚至更简洁。

是否将myElem“强制”到jQuery对象中

$(myElem).click(function() { ... });

只是将myElem“强制”到jQuery对象中

$(myElem).click(function() { ... });

---

使用实时事件。现在，当您将元素添加到dom中时，live事件将添加到新元素中

$(document).ready(function() {
  $("#tr-1").live("click", function() { 
    // blah blah 
  }); 
}

---

使用实时事件。现在，当您将元素添加到dom中时，live事件将添加到新元素中

$(document).ready(function() {
  $("#tr-1").live("click", function() { 
    // blah blah 
  }); 
}

---

请你再解释一下“而且你正在处理一个文档片段”是什么意思？谢谢。@字节码-当然！当你这样做的时候，你正在创建一个可以更快地使用的，你不是在使用DOM，而是一个包含节点的小片段，它可以更快地操作，你可以随心所欲地获取它，然后你可以将它插入到完整的DOM/你的页面中。这只是一种更有效（通常）的处理方式…jQuery还基于html字符串（最多512字节）缓存片段，因此您可以重用它们，使从html字符串创建节点的速度更快。非常感谢您的解释！请你再解释一下“而且你正在处理一个文档片段”是什么意思？谢谢。@字节码-当然！当你这样做的时候，你正在创建一个可以更快地使用的，你不是在使用DOM，而是一个包含节点的小片段，它可以更快地操作，你可以随心所欲地获取它，然后你可以将它插入到完整的DOM/你的页面中。这只是一种更有效（通常）的处理方式…jQuery还基于html字符串（最多512字节）缓存片段，因此您可以重用它们，使从html字符串创建节点的速度更快。非常感谢您的解释！谢谢，我不知道现场活动。然而，我的目标是消除

$（“#tr-1”）

扫描。不确定在一个页面上只有一个元素的元素上使用live（）有什么好处。将事件添加到元素的类或标记组中似乎更有用。谢谢，我不知道live events。然而，我的目标是消除

$（“#tr-1”）

扫描。不确定在一个页面上只有一个元素的元素上使用live（）有什么好处。将事件添加到元素的类或标记组中似乎更有用。