如何让DOM了解动态创建的新元素?

Rey*_*rPM 1 html javascript css jquery dom

我正在进行AJAX调用,我正在后端构建一些HTML.我将它们作为JSON返回,然后使用jQuery我渲染它们,如:

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

value.edit_link 包含以下HTML:

<a id="edit_0" 
   title="Edit" 
   onclick="javascript:return false;" 
   class="edit"
>Edit</a>
Run Code Online (Sandbox Code Playgroud)

然后我会得到这样的东西:

在此输入图像描述

正如您所看到的,链接没有手形光标.我的猜测是,当第一次呈现页面时,DOM不知道它们,因此不会应用CSS属性或默认属性,这让我问:

为了获得与之链接,cursor: hand我如何让DOM了解这些新元素?

pao*_*sso 6

解决方案1

添加到您的链接HTML href="#"或者href="javascript:void(0)"这样:

<a href="#"
   id="edit_0" 
   title="Edit" 
   onclick="javascript:return false;" 
   class="edit"
>Edit</a>
Run Code Online (Sandbox Code Playgroud)

要完全理解<a>html标签,请阅读此内容.

如果您不知道是否更好href="#"href="javascript:void(0)"(没人知道)阅读此讨论.

解决方案2

不要使用<a>但是<button>跟随情绪:

如果<a>按钮没有有意义的href,那就是a<button>

(对于<button>外面的人来说<form>感觉不对.你决定.)

所以:

<button id="edit_0" 
   onclick="javascript:return false;" 
   class="edit"
>Edit</button>
Run Code Online (Sandbox Code Playgroud)

按钮参考那里.