修改样式表时在某些浏览器(如360)下遇到Cannot read property 'style' of undefined错误的解决方案

来源:互联网 发布:js显示当前时间 编辑:程序博客网 时间:2024/06/06 20:04

自己写的2048游戏,在本地调试一切正常后,上传至服务器,Chrome效果正常,但发现JavaScript在360浏览器中出错,提示Uncaught TypeError: Cannot read property 'style' of undefined

错误定位如下图


这段代码是在页面加载后动态修改CSS样式表的属性。

看到这个错误,蒙了很久,为何本地和Chrome下是毫无问题的,360却提示这个错误?最后才发现问题所在。

在控制台显示document.styleSheets[0].cssRules,得到下面的结果


这个样式表明显不是原来有的,是浏览器强制加载进去的,看样子是用于广告屏蔽,但却影响了我的JS代码。

据此,在获取样式表时,做一个逻辑判断即可解决,代码如下:

var ocssRules = document.styleSheets[0].cssRules||document.styleSheets[0].rules;if(ocssRules.length<=1){ocssRules = document.styleSheets[1].cssRules||document.styleSheets[1].rules;}


0 0