查找具有与模式匹配的属性的元素

Question

如何查找具有与模式data-foo-bar-*匹配的属性的所有元素，例如

<div data-foo-bar-id="" />

将document.querySelectorAll与foo-bar-*模式一起使用会出错：

  

Uncaught SyntaxError：无法在'Document'上执行'querySelectorAll'：'[data-foo-bar- *]'不是有效的选择器。

Answer 1

也许迭代所有DOM元素并寻找这个特定的属性可能不是最好的方法，但这是我的尝试：

function querySelectorPattern(regex, element) {
  var elements = document.getElementsByTagName(element),
    found,
    regexp = new RegExp(regex);
  for (var i = 0; i < elements.length; i++) {
    var attributes = elements[i].attributes;
    for (var k = 0; k < attributes.length; k++) {
      if(regexp.test(attributes[k].nodeName)) {
        console.log(elements[i]);
      }
    }
  }
}

快速演示：https://jsfiddle.net/1rsngvy8/