js解决：Uncaught TypeError: Cannot read property 'dsiplay' of undefined问题

就如千千万万javascript学者一样，我遇到了同样的问题：Uncaught TypeError: Cannot read property 'display' of undefined

但我的情况更加特殊，在网上查询同样问题的解决方案之后，我发现没有一个和我类似，都无法解决我的问题。

对，我只能一个个调试，删删改改，终于找到了答案。

1.我定义样式的节点用的是class，用getElementsByClassName来获取

 var turn = document.getElementsByClassName("turn");

2.但是class是一类元素集合，是一个数组，返回的是class的所有元素，这时我修改样式的时候依然用obj.style，就出现了读不到属性的情况

picture.style.display = "none"

3.解决方案：将class用id替代是最简单的修改方案

将html的节点标签改成id，css、js文件相应更改，用getElementById来获取属性即可

var turn = document.getElementById("turn");

小结：

getElementByClassName

这个方法并不是返回指定的一个元素而是一类元素，即所有class为你设定的class名称的元素，所以它的返回结果应该是一个数组，那么你要改变样式就需要从数组中取到元素，再针对元素来设置属性，而不是直接数组设置属性，这样自然会无效。

使用方法(getElement s ByClassName不要漏掉了s，后边要用【0】指定数组元素）：

document.getElementsByClassName("bg")[0]

以下是方法解释;

getElementById() 方法返回带有指定 ID 的元素：【返回元素】

getElementsByTagName() 返回带有指定标签名的所有元素。【返回元素集合，即数组】

getElementsByClassName() 方法

最后的最后：本文小结部分为转载，侵删。原文https://www.imooc.com/qadetail/230436