0

我用过

var activeFilter = $('<li></li>').data('input-id', 'mycustomId');
$('#container').append(activeFilter);

现在我需要从已知<ul> 中的多个<li> 元素中获取特定的<li> 元素。

然而，明显的选择器不起作用。

var existing = $('li[data-input-id=mycustomId]');
alert(existing.length);

有用的链接： .prop() vs .attr() 如何获取、设置和选择具有数据属性的元素？

概括：

.prop()设置/获取 DOM 属性.. 例如 className

.attr()设置/获取标签属性.. 例如类，从而使选择器成为$('obj[class=xxx]')可能。

.data()设置/获取 jQuery 内部缓存属性并且不映射到属性或属性。

但是，在 html5 中设置.attr()并包含前缀"data-"的属性可以正确访问.data()，但不是 VICE VERSA！

http://jsfiddle.net/wjEvM/

在调试器中没有列出属性 data-input-id，但可以通过

$('#container li:firstchild').data('input-id');

问题是我如何获得（我必须使用哪个选择器）具有给定数据集值的 li（对象 ie），例如obj.getChildWithData('data-id', 'mycustomId'); 在循环中检查每个 li 的数据集的 OTHER THAN。或者使用愚蠢的 document.querySelectorAll，因为它不能满足需要。

如果它应该这样工作，请解释是否适用。将 data-* 属性设置为属性不允许我使用 html5 推荐的 .data() 。所以我想把它做好。

4

2 回答 2

2

您在此处使用属性选择器，如果您将 HTML5 数据设置为：

activeFilter.attr('data-input-id', 'mycustomId');

但是，您应该使用正确的合成器来访问它：

$('#container li:firstchild').data('inputId');

要回复您的评论，您可以使用 .filter() 检索它：

var existing = $('li').filter(function(){return $(this).data('inputId') === "mycustomId"});

看演示

于 2013-04-23T13:54:31.097 回答
0

不幸的是，对于您的方法，jQuery 不会.data()在 DOM 节点的data属性中存储数据集（请参阅此问题）。

相反，您需要使用 设置它.attr()，然后您可以使用$('li[data-input-id=mycustomId]')：

$('<li></li>').attr('data-input-id', 'mycustomId');
于 2013-04-23T13:55:57.470 回答