Почему JavaScript не выполняет функции?

Question

EnchantedLoom

html , css , javascript

Почему JavaScript не выполняет функции?

Как можно исправить ошибку "Uncaught TypeError: is not a function", которую я получаю при попытке использовать различные функции, такие как search и includes? Вот пример кода, который вызывает эту ошибку: 

```javascript
window.onload = () => {
    let input = document.getElementById('input');
    input.oninput = function () {
        let list = document.querySelectorAll('.ul li');
        let value = input.value.trim();
        if (value != '') {
            list.forEach(function (item) {
                if (item.textContent.includes(value)) {
                    // выполнить какие-то действия
                }
            })
        }
    };
}
```

HTML-код:

```html
<div class="search input-group" >
    <input type="search" name="" class="input__form" id="input" placeholder="Поиск товаров..">
    <ul class="ul list-group">
        <li id="item1" class="item4 list-group-item">TWS Apple Airpods Pro 1</li>
        <li id="item2" class="item4 list-group-item">TWS Apple Airpods Pro 2</li>
        <li id="item3" class="item4 list-group-item">TWS Apple Airpods Pro 3</li>
    </ul>
</div>
```

28 декабря 2023 г. 14:37

Ответы на вопрос 2

Похожие вопросы

Answer 1

Ошибка "Uncaught TypeError: is not a function" возникает, когда вы пытаетесь вызвать функцию, но переменная, которой вы пытаетесь вызвать функцию, не является функцией.

На основании вашего примера кода, проблема может возникнуть из-за того, что вы используете метод `querySelectorAll` для получения списка элементов, но возвращается коллекция элементов NodeList, а не массив. В результата перед использованием методов `forEach` и `includes`, вам следует преобразовать NodeList в массив.

Вот исправленный код, который решит эту проблему:

```javascript
window.onload = () => {
    let input = document.getElementById('input');
    input.oninput = function () {
        let list = Array.from(document.querySelectorAll('.ul li'));
        let value = input.value.trim();
        if (value != '') {
            list.forEach(function (item) {
                if (item.textContent.includes(value)) {
                    // выполнить какие-то действия
                }
            })
        }
    };
}
```

Теперь NodeList преобразуется в массив с помощью `Array.from`, и функции `forEach` и `includes` могут быть вызваны без ошибок.

Будьте внимательны, когда вы используете различные методы и функции в JavaScript. Убедитесь, что переменная, которую вы используете, является функцией, и что возвращаемые значения соответствуют вашим ожиданиям.

Answer 2

потому что querySelectorAll() возвращает не массив, а похожий на него объект (NodeList) 
 если нужен массив, нужно преобразовать вручную через Array.from()