0

我有一个脚本可以跨多个框架 findElementById 并突出显示/更改文本颜色。该脚本的工作原理是,当您将鼠标悬停在“The quick brown fox”的每个单词上时,您指针下的单词将变为红色并以黄色突出显示。frame2 中的相同单词也将被红色/突出显示。请注意,元素 ID 与类名相同。

<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 并按类查找元素。例如,当您将鼠标悬停在“狐狸”上时,id="w4"。我想在链接的类中找到“w4”,这样当鼠标悬停时,“The”和“fox”都会变成红色/突出显示。我不知道如何使用来自 id 的值来使用 getElementsByClassName。有什么想法吗?

4

1 回答 1

1

返回一个数组,getElementsByClassName你必须遍历它。试试下面的代码。

var elements = document.getElementsByClassName(id);

for(var i=0; i<elements.length; i++)
    elements[i].style.color = "red";
于 2013-02-20T18:03:37.147 回答