是否可以在元素数组上使用querySelectorAll？

说我有基于任何selector是否可以在元素数组上使用querySelectorAll？

var elems = document.querySelectorAll(selector);

我不知道什么是包含在elems，但是让我们假设elems.length > 0

我想使用querySelectorAll（或DOM元素的数组一些等价函数）elems来查找与其他选择器匹配的所有元素。

// example: find all buttons with class `foo` within `elems` array 
var buttons = elems.querySelectorAll("button.foo");

这不会（原因很明显）工作，但我不确定如何做到这一点，否则:(

这是我创造了从接受的答案上班包装@Tibos

// Element.matches wrapper 
(function(e){ 
    if (typeof e.matches !== "function") { 
    e.matches = e.webkitMatchesSelector || 
       e.mozMatchesSelector || 
       e.msMatchesSelector  || 
       e.oMatchesSelector  || 
       e.matchesSelector; 
    } 
})(Element.prototype);

来源

2014-02-18 naomik

你要问这样的相似： [DEMO]（http://jsfiddle.net/ashish41191/RanWJ/） –

可以使用Element#matches方法来过滤掉你原来的列表：

var elems = document.querySelectorAll(selector); 
var buttons = Array.prototype.filter.call(elems, function(elem){ 
    return elem.matches('button'); 
});

请注意，您可以在其中找到此方法的各种名称，您可能想要在它们周围封装一个函数。（请检查文档！）

另一种可能性是获得由document.querySelectorAll与两个选择器返回的两组元素的交集。有两种交集的各种实现，随意使用一个你喜欢的。 This question提供了一些想法。

来源

2014-02-18 18:08:03 Tibos

非常感谢这一点。我在原来的问题中添加了包装器。让我知道，如果这看起来对你好^^ – naomik

@naomik看起来不错 – Tibos

这就是你要找的如果我会找到你correct !!

SEE WORKING DEMO

来源

2014-02-18 18:15:46

这不会做他想做的事。这查找匹配查询的子元素，他希望数组中与查询匹配的元素。 –

这是我需要长达matches是不是更标准。

function getElementsFromParents(parentSelector, childSelector) { 
    var elems = document.body.querySelectorAll(parentSelector); 
    return Array.prototype.reduce.call(elems, function matcher(arr, el) { 
     var matches = el.querySelectorAll(childSelector); 
     if (matches.length) Array.prototype.forEach.call(matches, function pusher(item) { 
      arr.push(item); 
     }); 
     return arr; 
    }, []); 
}

来源

2014-05-25 22:07:52

querySelectorAll返回一个节点列表的结构，所以我们改变为一个数组列表，我们可以使用功能图谱。

var lines = Array.prototype.slice.call(document.querySelectorAll(selector)); 
    var paths = lines.map(function(elem){ 
    return elem.querySelector('button'); 
    });

来源

2017-05-07 22:56:20 davin

是否可以在元素数组上使用querySelectorAll？

回答

相关问题