getElementsByClassName问题

Question

我目前遇到了getElementsByClassName属性的问题。我有一个显示和隐藏功能，当你将鼠标悬停在产品上时显示一个按钮click here我已经使用getElementById属性启用了这个功能，但是由于我想要使用类重复这个功能是更好的做法。下面的代码是否使用ClassName JS函数解决此问题的正确方法？

另外我一直在阅读IE8中不支持getElementsByClassName这是真的吗？有没有办法解决这个问题？

  <script>    
  function show(viewProductBtn){
document.getElementByClassName(viewProductBtn).style.visibility = "visible";
}

function hide(viewProductBtn) {
document.getElementByClassName(viewProductBtn).style.visibility = "hidden";
}
</script>

<!--HTML-->
<div class="product-shot-bg" onMouseOver="show('viewProductBtn')"      onMouseOut="hide('viewProductBtn')">
        <a href="#" class="viewProductBtn"></a>

目前我已将我的开发站点切换回getByID，以演示过渡应如何工作..

Answer 1

getElement的 s ByClassName

“元素 s ”复数形式。意思是，该函数返回一个数组（实际上是一个NodeList），所以你需要循环遍历数组，或者如果只需要那个元素就得到第一个元素。

另请参阅document.querySelector("."+viewProductBtn)表示一个元素，document.querySelectorAll("."+viewProductBtn)表示多个元素，或考虑使用ID和getElementById。