1. ホーム
  2. javascript

[解決済み] フィルターは機能ではない?[重複しています]。

2022-02-16 15:12:01

質問

リスト項目に "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);

解決方法は?

クエリセレクターオール が返されます。 ノードリスト でなく 配列 . Arrayのメソッドを使用したい場合は、Arrayに変換することができます。

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