getElementsByClassName问题

Question

我目前对getElementsByClassName属性有问题。我有一个显示和隐藏函数，当您悬停在产品单击此处上时，它会显示一个按钮--我已经使用getElementById属性启用了这个函数，但是，由于我希望使用类复制这个函数，这是更好的做法。下面的代码是否是使用ClassName JS函数解决此问题的正确方法？

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

  <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。