javascript - jquery .html()函数没有给出数据属性设置值

Question

我有一段js代码，它获取一个元素的html代码，以便将其发送到服务器端保存。 html 本身是动态生成的，其中的每个元素都有一个也是动态设置的 data-target 属性。因此，在发送要保存的 html 字符串之前，使用 jquery 的 .html() ，如下所示:

var SaveString = $('#ElementID').html();

我得到的 html 不包含每个子元素的 data-target 属性的值，而是显示为空白

data-target=""

任何人都可以知道那里发生了什么吗？

Answer 1

这是因为当您使用 data() 方法来存储元素信息时，它存储在 jQuery 内部用作缓存的对象中。该信息不会添加到 DOM 中。

如果要向 DOM 添加 data-* 属性，则需要使用 attr() 来设置它，例如:

$element.attr('data-target', 'foo');

当您检索父元素的 html() 时，就可以访问它了。

Example fiddle