Как использовать Element ID для getElementsByClassName?

У меня есть сценарий, который найдетElementById через несколько кадров и выделит/изменит цвет текста. Скрипт работает так, что когда вы наведете каждое слово «Быстрая коричневая лиса», слово под вашим указателем будет красным и выделено желтым цветом. То же самое слово в frame2 будет красным/выделенным. Обратите внимание: идентификаторы элементов идентичны именам классов.Как использовать Element ID для getElementsByClassName?

<html><head><title>Test</title> 
    <script> 
    function hey(id) 
     {document.getElementById(id).style.color = "red"; 
     document.getElementById(id).style.backgroundColor = "yellow"; 
     window.parent.frames["frame2"].document.getElementById(id).style.color = "red"; 
     window.parent.frames["frame2"].document.getElementById(id).style.backgroundColor = "yellow";} 
    function bye(id) 
     {document.getElementById(id).style.color = "black"; 
     document.getElementById(id).style.backgroundColor = "white"; 
     window.parent.frames["frame2"].document.getElementById(id).style.color = "black"; 
     window.parent.frames["frame2"].document.getElementById(id).style.backgroundColor = "white";} 
    </script> 
</head> 
<body> 
    <a id="w1" class="w1 w4" onmouseover="hey(this.id)" onmouseout="bye(this.id)">The</a> 
    <a id="w2" class="w2" onmouseover="hey(this.id)" onmouseout="bye(this.id)">quick</a> 
    <a id="w3" class="w3" onmouseover="hey(this.id)" onmouseout="bye(this.id)">brown</a> 
    <a id="w4" class="w1 w4" onmouseover="hey(this.id)" onmouseout="bye(this.id)">fox</a> 
</body></html>

Теперь я хочу отредактировать этот скрипт так, чтобы он принял идентификатор и нашел элементы по классам. Например, когда вы наведете указатель мыши на «лису» id = «w4». Я хочу найти «w4» в классе ссылки, так что «The» и «fox» будут красными/выделенными всякий раз, когда они затушевываются. Я не могу понять, как использовать getElementsByClassName, используя значения из id. Есть предположения?

источник

2013-02-20 parap

Просто передайте имя класса в качестве аргумента: 'getElementsByClassName (id)'. Дополнительная информация: https://developer.mozilla.org/en-US/docs/DOM/document.getElementsByClassName. Btw, вы можете напрямую передать элемент в обработчик события, а не искать его снова. –

getElementsByClassName возвращает массив, в котором вы должны его пересечь. попробуйте приведенный ниже код.

var elements = document.getElementsByClassName(id); 

for(var i=0; i<elements.length; i++) 
    elements[i].style.color = "red";

источник

2013-02-20 18:03:37

'getElementsByClassName()' does _not_ возвращает массив, он возвращает [NodeList] (https://developer.mozilla.org/en-US/docs/DOM/NodeList). – Teemu

Я пробовал вышеуказанный код. Хм. Не работает. – parap

О, я набрал «i> элементы», а не «i parap

Как использовать Element ID для getElementsByClassName?

ответ

Смежные вопросы