jQuery数据attr没有设置

这似乎很简单，但我不明白为什么它不起作用。 选择器是正确的，但div .faqContent根本没有使用data-height属性更新。

 $('.faqItem .faqContent').each(function(){ var h = $(this).height(); $(this).data('height',h); }); 

我已经检查过var h是否正确，它在colsole.log中正确保持高度。

编辑绝对没有冲突，控制台显示没有错误。

Answer 1

您将无法在元素检查器中看到它，但它在那里，因为jquery在内部设置了data属性。

试试console.log($(this).data('height'));

Answer 2

datafunction让很多人感到困惑，不仅仅是你。 🙂

data管理jQuery的元素内部数据对象， 而不是 data-*属性。 data仅使用data-*属性来设置初始值 。 它从不在元素上设置 data-*属性。

如果要实际设置data-*属性，请使用attr ：

 $(this).attr("data-height", h); 

但是如果您只是想将此信息用于将来使用，那么data很好，只是不要指望在DOM检查器中看到它，因为jQuery不会将此信息写入DOM。

Answer 3

.data()仅将关联的新值存储在内存中（或内部 ）。 它不会更改DOM中的属性，因此您无法使用检查器工具更新它。

要更改属性，可以使用.attr（） ：

 $('.faqItem .faqContent').each(function(){ var h = $(this).height(); $(this).attr('data-height',h); }); 

Answer 4

JQuery .data（）将值存储在元素本身上，它不会添加属性。

http://api.jquery.com/data/

如果要添加属性，请使用attr：

 $('.faqItem .faqContent').each(function(){ var h = $(this).height(); $(this).attr('data-height', h); }); 

http://api.jquery.com/attr/