JS错误解决方案:Uncaught TypeError cannot set property ‘innerhtml’ of null

在Javascript, Uncaught TypeError 就是未能识别的错误,基本都是顺序的问题,比方说要召唤某个object的时候但是这个object的dom在script后面,就导致无法识别。an Uncaught error is a type of error that is not caught in a catch statement.

Uncaught TypeError cannot set property ‘innerhtml’ of null 这是因为 要设置innerhtml 在一个没有的物体上,就是js加载比object 加载更前了。 只要把JS放在页面完成后再加载就可以识别了。所以基本是要把JS放在文件尾部。

基本上有三种解决方法:

第一种就是把div放在JS前。让JS加载在document全部加载之后。这样就没有错误了。

第二种:使window.onload方法来进行条件设置:window.onload是 来页面全部加载之后再来执行脚本。

<!DOCTYPE HTML>
<html>
<head>
<title>Uncaught TypeError</title>
<script>
function whatis(){
document.getElementById('hello').innerHTML = 'hi';
}
window.onload = function () {
whatis();
}
</script>
</head>
<body>
<div id="hello"></div>
</body>
</html>

这个js就设置了一个决定性的条件方法,就是当window.onload的时候才加载执行函数,这样就不会出现错误。

第三种:用Jquery的ready() 方法来加载Jquery库。

<!DOCTYPE HTML>
<html>
<head>
<title>Untitled Document</title>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
function whatis(){
document.getElementById('hello').innerHTML = 'hi';
}
//  $( document ).ready() block.
$( document ).ready(function() {
whatis();
});
</script>
</head>
<body>
<div id="hello"></div>
</body>
</html>

首先要加载JS, 上面代码是通过cdn加载的。这个方法使用了ready方法来确保函数在页面加载完成之后再执行。 先执行ready() 函数然后ready() 函数执行 我们的自定义函数。

Share :