查找 javascript 中所有没有 data- 属性的元素

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()您可以使用和选择器的组合[attribute]（fiddle）：

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

没有任何数据属性

答：dataset您可以使用（fiddle ）检查元素中是否有任何内容：Object.keys()

$(".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 可能不可用。}

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()}