Chrome控制台报错个人总结(不定时更新)

　　

最近开始使用Chrome控制台检测代码错误，对于经常碰到的报错做一个汇总，免得每次遇到都要重新想一遍策略，错误原因，重复劳动，浪费时间。

　　由于不是每个错误都能碰到，以下仅列出个人写代码时经常碰到的报错，以及个人理解与解决办法。随着时间的增长，遇到其他错误时再更新。

　　

Chrome控制台报错汇总:

　　1、 Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'

　　    在'节点'上执行函数'appendChild'失败：不是节点

　　    原因：要插入的内容不是节点，无法插入。

　　    解决办法：返回检查准备插入内容的节点属性。若要插入纯文本，请使用document.createTextNode()进行文本节点创建（我犯的错误，囧）。

　　2、Invalid or unexpected token

　　    无效的符号

　　　 原因：多见于插入中文符号，如‘；’。

　　    解决办法：根据报错行提示，返回编辑器查找符号错误进行修改。

　　3、2 arguments required, but only 1 present.系列

　　    需要2个参数，当前只有1个参数

　　　 原因：函数方法中必需的参数没有写全。例如setAttribute(attr,val)，必需两个参数都写全。

　　　 解决方法：检查所调用函数的所需参数值，填写完整。

　　4、 XXX（变量名） is not defined

　　     变量没有被创建

　　　  原因：引用的变量名写错，或者在let及const声明，对变量初始化与赋值前引用了变量。

　　      解决办法：① 查找变量在环境中的位置，确保调用位于变量声明后；

　　　　　　　　   ② 确认变量名没有打错；

　　5、Identifier XXX（变量名） has already been declared

　　　 变量已经被声明

　　　  原因：变量名重复（使用var声明的话，不会出现此错误）。

　　      解决方法：换个变量名。

　　6、 Assignment to constant variable

　　      给一个常量配值

　　　  原因：变量为const声明的常量，无法对常量值进行修改。

　　　  解决办法：将const声明修改为let或var声明

　　7、Exception: DOMException: Blocked a frame with origin "null" from accessing a cross-origin frame.

　　　　阻止了一个域为null的frame页面访问另一个域为null的页面

　　　　原因：打开本地页面时，页面中存在多个frame框架，造成了跨域访问

　　　　解决办法：localhost访问本地页面

　　8、Uncaught DOMException: Failed to execute 'webkitMatchesSelector' on 'Element': '[object HTMLBodyElement]' is not a valid selector.

　　　　在Element元素上执行webkitMatchesSelector方法失败：[object HTMLBodyElement]不是合理参数

　　　　原因：Element.matchesSelector方法只接收CSS选择符为参数，跟querySelector传入的参数一致

　　　　解决办法：改变参数

　　9、XXX call super constructor in derived class before accessing 'this' or returning from derived constructor.

　　　　使用了继承的class类在使用前没有调用super导入

　　　　原因：使用class继承时，必须在constructor函数中使用super

　　　　解决办法：在contructor中调用super()