在纯JavaScript中选择没有任何数据属性的元素

时间:2018-09-25 11:27:34

标签: javascript

我有一个列表,我想选择没有任何数据属性的第一个列表元素“ li”

<ul>
    <li data-row="down"><a class="scroll" href="#home">home</a></li>
    <li data-space="down"><a class="scroll" href="#home">home</a></li>
    <li data-direction="down"><a class="scroll" href="#about">about</a></li>
    <li><a class="scroll" href="#team">team</a></li>
    <li><a class="scroll" href="#service">service</a></li>
    <li><a class="scroll" href="#portfolio">portfolio</a></li>
    <li data-direction="down"><a class="scroll" href="#blog">blog</a></li>
</ul>

我知道如何取消选择特定数据属性

document.querySelector('li:not([data-direction])');

但是我需要更通用的东西

document.querySelector('li:not([data-*])');

这不起作用

1 个答案:

答案 0 :(得分:1)

const getAllElements = selector => Array.from(document.querySelectorAll(selector)
const isDataAttribute = attr => attr.startsWith('data-')
const hasDataAttribute = el =>
  Array.from(el.attributes)
    .every(isDataAttribute) 

getAllElements('li')
  .filter(hasDataAttribute)