如何让 DOM 知道动态创建的新元素？

【问题标题】：How do I let the DOM know about new elements created on the fly?如何让 DOM 知道动态创建的新元素？
【发布时间】：2016-12-02 21:13:47
【问题描述】：

我正在进行 AJAX 调用，并且正在后端构建一些 HTML。我将它们作为 JSON 返回，然后使用 jQuery 渲染它们，例如：

$(data.message).each(function (index, value) {
    $('#states_table tbody').append('<td>' + value.edit_link + '</td>');
});

value.edit_link 包含以下 HTML：

<a id="edit_0" 
   title="Edit" 
   onclick="javascript:return false;" 
   class="edit"
>Edit</a>

然后我会得到这样的结果：

正如您所见，该链接没有手形光标。我的猜测是，第一次渲染页面时 DOM 不知道它们，因此不会应用 CSS 属性或默认属性，这让我问：

为了获得与cursor: hand 的链接，我如何让 DOM 知道这些新元素？

【问题讨论】：

【解决方案1】：

解决方案 1

添加到您的链接 html href="#" 或 href="javascript:void(0)" 所以：

<a href="#"
   id="edit_0" 
   title="Edit" 
   onclick="javascript:return false;" 
   class="edit"
>Edit</a>

要全面理解<a> html 标签，请阅读this。

如果您不知道href="#" 或href="javascript:void(0)"（没人知道）哪个更好，请阅读this discussion。

解决方案 2

不要使用<a>，而是在the sentiment之后使用<button>：

如果<a> 按钮没有有意义的href，则它是<button>

（对于在<form> 之外的人来说，<button> 感觉不对。你决定。）

所以：

<button id="edit_0" 
   onclick="javascript:return false;" 
   class="edit"
>Edit</button>

按钮引用there。

【讨论】：