Невозможно выбрать дочерние элементы, используя getElementsByTagName

76
7

Вот код HTML:

<span class="holder">
<a href="/menu/page1">Navigate</a>
</span>

Я хочу, чтобы выбрать все такие тег с держателем класса, а затем в соответствии с этими держателями я хочу изменить HREF в a тега.

То, что я пробовал:

var holders = document.getElementsByClassName('holder'),
i = holders.length;

while(i--) {
holders[i].getElementsByTagName('a').href = "http://www.google.com";

}

Но приведенный выше код не работает. Он не меняет href из /menu/page1 на мою специальную ссылку. Что я делаю не так?

Поскольку я работаю с какой-либо внешней веб-страницей, я не могу использовать jquery. Только Javascript решения, пожалуйста. Спасибо.

спросил(а) 2021-01-28T00:36:17+03:00 3 месяца, 1 неделя назад
1
Решение
97

getElementsByTagName возвращает коллекцию элементов, если вы хотите получить первую ссылку, используйте .getElementsByTagName('a')[0]

ответил(а) 2021-01-28T00:36:17+03:00 3 месяца, 1 неделя назад
62

Поскольку элемент perent может содержать несколько экземпляров одного и того же тега, поэтому getElementsByTagName возвращает коллекцию элементов/узлов

Итак, вы должны обработать его как массив. Пыльник - один из лучших способов сделать это

var holders = document.getElementsByClassName('holder'),
i = holders.length;

while(i--) {
var anchors = holders[i].getElementsByTagName('a');
for (var j = 0; j < anchors.length; j++) {
anchors[j].href="'http://www.google.com";
}

}

Демо-скрипт

ответил(а) 2021-01-28T00:36:17+03:00 3 месяца, 1 неделя назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема