修改元素样式报错：Cannot set properties of undefined (setting 'visibility')

1、正常书写代码如下：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14

<div class="cl">      <div id="mask">        <span id="close">X</span>      </div>  </div>   <!-- JS代码如下 -->    <script>      let close = document.getElementById("close");      let cl = document.getElementsByClassName("cl");      close.onclick = function () {        cl.style.visibility = "hidden";      };    </script>

2、出现报错信息：Uncaught TypeError: Cannot set properties of undefined (setting 'visibility')

 3、解决办法

?

1 2 3 4 5

通过添加[0]来获取准确元素节点 （1） let cl = document.getElementsByClassName("cl")[0];    直接通过ID获取DOM元素节点 （2） let cl = document.getElementById("cl");

4、总结原因

使用getElementsByClassName得到的是一个HTMLCollection，要用getElementsByClassName(“content”)[0]的形式。