Question

我需要找到$('.post-content')中没有数据属性的所有元素。我试着说if (!$('.post-content p').attr('data-example')) { ... }

之类的东西

但显然这不起作用。那我该如何做呢：

查找属于没有数据属性的.post-content的所有p标记并将其删除。

我认为它很直接，但所有堆栈问题和文档，以及jquery和互联网只是“如何添加，如何查找，如何添加值 - 数据属性”

所以我并不完全清楚，道歉。在示例中：

<div class="post-content">
  <p data-attribute="foo">
    <span data-attribute="boo">
     <p>...</p>
    </span>
  </p>
  <p> ... </p>
</div>

我不想要嵌套的p标签，就像你在这里看到的那样，p标签下有一个嵌套的p标签，有一个数据属性，要删除。只是没有数据属性的顶级p标记。

提供的解决方案倾向于删除嵌套和顶级。

Answer 1

您可以使用.not()和has attribute selector

$('.post-content p').not('[data-example]')

Answer 2

没有特定的数据属性

您可以结合使用:not()和[attribute]选择器（fiddle）：

$(".post-content p:not([data-something])").remove();

没有任何数据属性

A。：您可以使用Object.dataset（keys()）检查元素fiddle中是否有任何内容：< / p>

$(".post-content p").filter(function(){
   return Object.keys(this.dataset).length === 0;
}).remove();

...或者您可以使用for...in：

$(".post-content p").filter(function(){
   for (var prop in this.dataset) {
       return false;
   }
   return true;
}).remove();

_{注意：根据您需要支持的浏览器，dataset may not be available。}

B。：您可以简单地遍历元素attributes（fiddle）：

$(".post-content p").filter(function(){
    return ![].some.call(this.attributes, function(attr){
        return /^data-/i.test(attr.name);
    });
}).remove();

_{另请参阅：filter()和Array.prototype.some()}

Answer 3

您的意思是特定的数据属性，还是任何数据属性（例如data-a，data-b，... data-z，data-aa，data-ab，......）？

如果你的意思是一个特定的属性，那么这样的事情应该有效：

$(".post-content p:not([data-example]").remove()

但如果你的意思是任何数据属性，那就是一个完整的东西。您必须找到所有潜在的元素，然后枚举它们的每个属性集合（例如$ foo [0] .attributes）以查看它们的任何名称是否以＆＃34; data - ＆＃34;开头。如果你必须这样做，我希望你没有很多元素，它不会很快。也许您可以解释一下您尝试解决的问题是什么，因为可能有更好的方法来做到这一点。例如在这些元素上保留已知的特定属性。

Answer 4

您可以使用.dataset属性（仅适用于较新的浏览器），也可以使用.attributes属性查找以"data-"开头的属性。

这是一个使用attributes列表的版本，可以在各种浏览器中使用（不需要.dataset支持）：

$(".post-content").find("*").filter(function() {
    var attrs = this.attributes;
    regex = /^data-/;
    for (var i = 0; i < attrs; i++) {
        if (regex.test(attrs[i].name)) {
            // found a "data-xxxx" attribute so return false to avoid this element
            return false;
        }
    }
    // did not find any "data-xxxx" attributes so return true to include this element
    return true;
}).remove();

你的问题在某一点上并不完全清楚。此代码检查.post-content的所有后代。如果您想将其缩小到该层次结构中的某些类型的对象，则可以更改初始选择器以缩小它。

查找javascript中没有数据属性的所有元素

4 个答案:

没有特定的数据属性

没有任何数据属性