写了一个函数,在调用时出错:"Uncaught TypeError: Cannot set property 'innerHTML' of null"

代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
var func3 = function(a,b){
return a + b
}
console.log(func3(1,2))
var x = func3(99, 1)
console.log(x)
document.getElementById('demo').innerHTML = x; </script>
</head>
<body>
<p id=demo>即将要被修改的值</p>
</body>
</html>

解释:错误原因为document中的innerHTML为空,也就是说在加载js文件时,找不到其中调用的对象即文中的<p>标签。

因此需要将js文件引用放置到<p>标签之后,即

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
var func3 = function(a,b){
return a + b
}
console.log(func3(1,2)) </script>
</head>
<body>
<p id=demo>即将要被修改的值</p>
<script>
var x = func3(99, 1)
document.getElementById('demo').innerHTML = x;
</script>
</body>
</html>

总结:这个小问题暴露了html文件加载顺序的理解问题。即html中的内容是按照HTML本身的先后顺序加载的。

因此在引入js时或者直接添加<script>内容时在html内容之后执行。

JavaScript中"Uncaught TypeError: Cannot set property 'innerHTML' of null"错误的更多相关文章

  1. day01-JavaScript中"Uncaught TypeError: Cannot set property 'innerHTML' of null"错误

    转行学开发,代码100天.初写了最简的一段Js代码,即通过document中的innerHTML方法修改一个<p>标签的内容,报以下错误. -"Uncaught TypeErro ...

  2. Uncaught TypeError: Cannot set property 'innerHTML' of null

    学习Chrome插件时,要在弹出页面中显示当前时间,结果怎样也显示不出来 看了 http://www.cnblogs.com/mfryf/p/3701801.html 这篇文章后感悟颇深 通过调试发现 ...

  3. Uncaught TypeError: Cannot read property 'length' of null错误怎么处理?

    Uncaught TypeError: Cannot read property 'length' of null 错误怎么处理? 1.可能是返回的datagrid数据格式有问题,比如{"t ...

  4. (转)Uncaught TypeError: Cannot set property 'innerHTML' of null

    (转)http://www.cnblogs.com/Ricky-Huang/p/5536253.html 在使用Ueditor的时候,会爆出这样的错误: 浏览器控制台就报错了 Cannot set p ...

  5. 前台报错:Uncaught TypeError: Cannot read property '0' of null

    错误现象: var div1=mycss[0].style.backgroundColor;  //这一行提示360和chrome提示:Uncaught TypeError: Cannot read  ...

  6. JavaScript Uncaught TypeError: Cannot read property 'value' of null

    用 JavaScript 操作 DOM 时出现如下错误: Uncaught TypeError: Cannot set property 'value' of null Uncaught TypeEr ...

  7. Uncaught TypeError: Cannot set property 'onclick' of null解决办法

    如果把js内容直接放在这个head标签以内,button按钮不能正常点击更换body的背景颜色,报错提示:demo6.html:16 Uncaught TypeError: Cannot set pr ...

  8. Uncaught TypeError: Cannot read property 'insertAdjacentHTML' of null

    在开发Ext 项目中如果遇到 Uncaught TypeError: Cannot read property 'insertAdjacentHTML' of null 这个错误,检查下renderT ...

  9. Uncaught TypeError: Cannot read property 'ownerDocument' of null

    /********************************************************************* * Uncaught TypeError: Cannot ...

随机推荐

  1. jumpserver跳板机docker安装小小趟坑

    最近日常运维的时候发现每次登陆服务器都要打开终端目录连接对应的服务器,闲暇的时候还好,运维任务很重的时候才发现这样的玩法很傻,浪费时间且一点儿都跟不上潮流,然后打开githup开始搞起来.docker ...

  2. Centos安装MySQL5.6并重置密码

    数据库配置 如果用的是自带的sqllite那么数据库就可以不动 安装MySQL5.6数据库 这里强烈建议用使用5.6, 5.7版本的数据库遇见了很多BUG 安装MySQL wget http://de ...

  3. java_八大数据类型

    一.整型 1.byte  1个字节(8位--一个字节占8位)-128~127 2.short  2个字节  -32768~32767 3.int      4个字节(常用) 4.long   8个字节 ...

  4. DATASNAP双缓存下载文件

    原文链接:http://www.cnblogs.com/hnxxcxg/archive/2012/12/29/2839358.html procedure TFrmMain.btnUpdateFile ...

  5. 用 Spark 处理复杂数据类型(Array、Map、JSON字符串等)

    split 对列表进行切割,然后生产新的列表 from pyspark.sql.functions import split# 对 key列按照 0-9之间的数字进行风格 重新命名为 s  df.se ...

  6. linux中部署django项目

    通过Nginx部署Django(基于ubuntu) Django的部署可以有很多方式,采用nginx+uwsgi的方式是其中比较常见的一种方式. 在这种方式中,我们的通常做法是,将nginx作为服务器 ...

  7. python_三元运算符

    三元运算又称三目运算,是对简单的条件语句的简写 简单条件语句: if 条件成立: val = 1 else: val = 2 改成三元运算: val = 1 if 条件成立 else 2 举例: a ...

  8. MyBatis中的OGNL教程

    MyBatis中的OGNL教程 有些人可能不知道MyBatis中使用了OGNL,有些人知道用到了OGNL却不知道在MyBatis中如何使用,本文就是讲如何在MyBatis中使用OGNL. 如果我们搜索 ...

  9. RHEL6 学习:使用 cryptsetup 给分区加密

    RHEL6 学习:使用 cryptsetup 给分区加密 今天学习了 RHEL 对硬盘分区加密的知识,在 RHEL 系统里可以通过使用 cryptsetup 工具对硬盘分区进行加密,加密后的分区需要输 ...

  10. Java8-Stream-No.13

    import java.security.SecureRandom; import java.util.Arrays; import java.util.stream.IntStream; publi ...