过滤不是函数？

Question

如果列表项中包含文本“Flexbox”，我将尝试返回它们的数组。

我收到此错误： Uncaught TypeError: items.filter is not a function

     <ul>
        <li data-time="5:10">Flexbox 1</li>
        <li data-time="5:10">Something else</li>
        <li data-time="5:40">Flexbox 2</li>
        <li data-time="5:10">Something also else</li>
        <li data-time="5:40">More Flexbox for you</li>
    </ul>

'use strict';

var items = document.querySelectorAll('li');

var itemsFlex = items.filter(function(item) {
    return item.includes('Flexbox')
});

console.log(itemsFlex);

原文由 Evanss 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

querySelectorAll 返回 NodeList 而不是 Array 。如果您想使用数组方法，可以将其转换为数组。

 var items = document.querySelectorAll('li');
var itemsArray = Array.from(items);

原文由 Jordan Soltman 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

The querySelectorAll does not return an array , that is the reason why filter is not defined (which is a function of array ).在这种情况下，您应该致电 filter textContent.indexOf(string) Flexbox Array.prototype --- ）。样品：

 var items = document.querySelectorAll('li');
var filter   = Array.prototype.filter;

var itemsFlex = filter.call(items, function(item) {
    return item.textContent.indexOf('Flexbox') >= 0;
});

console.log(itemsFlex);

请在此处查看示例： https ://jsbin.com/hibixipoyo/edit?html,js,output

原文由 Felipe Oriani 发布，翻译遵循 CC BY-SA 3.0 许可协议