почему document.getElementsByName (). length всегда возвращает 0? - PullRequest
Новая
       20

почему document.getElementsByName (). length всегда возвращает 0?

2 голосов
/ 29 мая 2020

Я новичок в JavaScript. В следующем коде getElementsByName("li").length всегда возвращает 0, хотя в моем HTML много тегов <li>, почему? 

document.addEventListener('DOMContentLoaded', function() {
    var len = document.getElementsByName('li').length;
    alert(len);
})

art of my HTML:

<body>
    <ul>
        <li>aaaaaa</li>
        <li>bbbbbb</li>
        <li>cccccc</li>
    </ul>
</body>

Ответы [ 3 ]

1 голос
/ 29 мая 2020

Замените

document.getElementsByName('li')

на

document.getElementsByTagName('li')

Это происходит потому, что вы выбираете tag name, а не name! Вы используете неправильную функцию!

0 голосов
/ 29 мая 2020

Вы можете сделать что-то подобное, потому что getElementsByTagName() возвращает NodeList, поэтому вы можете перебирать его как массив или получать длину. 

document.addEventListener('DOMContentLoaded', function() {
    var listElements = document.getElementById('list').getElementsByTagName("li");
    alert(listElements.length);
})
<body>
    <ul id="list">
        <li >aaaaaa</li>
        <li>bbbbbb</li>
        <li>cccccc</li>
    </ul>
</body>

getElementsByName() хотя также возвращает NodeList, но возвращает список всех одинаковых элементов имени в целом документе поэтому, чтобы эта работа работала, вам нужно дать одно и то же имя всем элементам списка. 

document.addEventListener('DOMContentLoaded', function() {
    var len = document.getElementsByName('name').length;
    alert(len);
});
<body>
    <ul>
        <li name="name">aaaaaa</li>
        <li name="name">bbbbbb</li>
        <li name="name">cccccc</li>
    </ul>
</body>
0 голосов
/ 29 мая 2020

Метод, который вы пытаетесь использовать, пытается найти определенный c элемент по его имени.

Ни один из элементов вашего списка не имеет имени, для этого вам следует обновить свой код, чтобы у ваших элементов были имена. 

document.addEventListener('DOMContentLoaded', function() {
    var len = document.getElementsByName('list_item_1').length;
    alert(len);
})    

<li name="list_item1">aaaaaa</li>
...