getElementsByClassName问题

Question

我目前遇到了getElementsByClassName属性的问题.我有一个显示和隐藏功能,当你将鼠标悬停在产品上时显示一个按钮点击这里我已经使用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

getElementsByClassName

复数中的"元素s ".意思是,该函数返回一个数组(实际上是一个NodeList),所以你需要循环遍历数组,或者如果只需要那个元素就得到第一个元素.

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