用 JavaScript 操作 DOM 时出现如下错误:

   Uncaught TypeError: Cannot set property 'value' of null
Uncaught TypeError: Cannot read property 'id' of undefined

例如:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script>
var div = document.getElementById("测试1");
alert(div.id);
alert(div.className);
alert(div.title);
</script>
<title>测试</title>
</head>
<body>
<div id="测试1" class="测试2" title="测试3">
<span>0</span>
<span>1</span>
<span>2</span>
<span>3</span>
</div>
</body>
</html>

运行时出现如下错误:

问题出在 JS 运行的时候你的页面还没有加载完成,所以你的 JS 代码找不到你的页面元素,就会抛出这个问题。解决办法就是把 JavaScript 代码放在 body 的最后,例如:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>测试</title>
</head>
<body>
<div id="测试1" class="测试2" title="测试3">
<span>0</span>
<span>1</span>
<span>2</span>
<span>3</span>
</div>
<script>
var div = document.getElementById("测试1");
alert(div.id);
alert(div.className);
alert(div.title);
</script>
</body>
</html>

JavaScript Uncaught TypeError: Cannot read property 'value' of null的更多相关文章

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

    写了一个函数,在调用时出错:"Uncaught TypeError: Cannot set property 'innerHTML' of null" 代码如下: <!DOC ...

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

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

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

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

  4. Uncaught TypeError: Cannot read property 'addEventListener' of null

    <script type="text/javascript"> var body1=document.getElementById('#body') </scri ...

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

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

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

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

  7. Three.js three.js Uncaught TypeError: Cannot read property 'getExtension' of null

    在调试Three.js执行加载幕布的时候,突然爆出这个错误three.js Uncaught TypeError: Cannot read property 'getExtension' of nul ...

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

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

  9. 解决sweetalert 无故报错 elem.className.replace Uncaught TypeError: Cannot read property 'className' of null

    今天碰到这么一个问题,在使用sweetalert的时候时有时无会报错 elem.className.replace Uncaught TypeError: Cannot read property ' ...

随机推荐

  1. JVM基础系列第2讲:Java 虚拟机的历史

    说起 Java 虚拟机,许多人就会将其与 HotSpot 虚拟机等同看待.但实际上 Java 虚拟机除了 HotSpot 之外,还有 Sun Classic VM.Exact VM.BEA JRock ...

  2. Java核心技术及面试指南:视频列表

    如下是本书相关内容的视频列表,会动态更新 第一章 1 视频1.1  JDK和JRE和JVM的区别,安装Java开发环境    1.1.1  第2页 2 视频1.2  编写第一个HelloWorld程序 ...

  3. 设计模式java实现合集

    http://www.cnblogs.com/maowang1991/archive/2013/04/15/3023236.html 桥接模式:http://blog.csdn.net/jason05 ...

  4. Java基础3:深入理解String及包装类

    更多内容请关注微信公众号[Java技术江湖] 这是一位阿里 Java 工程师的技术小站,作者黄小斜,专注 Java 相关技术:SSM.SpringBoot.MySQL.分布式.中间件.集群.Linux ...

  5. 剖析HBase负载均衡和性能指标

    1.概述 在分布式系统中,负载均衡是一个非常重要的功能,在HBase中通过Region的数量来实现负载均衡,HBase中可以通过hbase.master.loadbalancer.class来实现自定 ...

  6. ReentrantLock原理学习

    上文我们学习了ReentrantLock的基本用法,在最后我们留下了一个问题,ReentrantLock获取的锁是什么锁呢?本文我们就从源码的角度来一探究竟.本文涉及到的源码对应JDK版本为1.8. ...

  7. Object类toString()

    Object类是java所有类的始祖,在java中每个类都是由它扩展而来. toString()方法返回一个包含类名与内存地址的文本形式的字符串  即打印对象的时候便会调用此方法. 强烈建议为自定义的 ...

  8. C语言实现链队列的初始化&进队&出队

    /*链表实现队列的一系列操作*/ #include<stdio.h> #include<stdlib.h> #define OK 1 #define ERROR 0 typed ...

  9. .NetCore2.1 WebAPI新增Swagger插件

    说明 Swagger是一个WebAPI在线注解.调试插件,过去我们主要通过手工撰写WebAPI接口的交互文档供前端开发人员或外部开发者, 官网地址:https://swagger.io/. 但是在实际 ...

  10. Java并发专题(一)认识线程

    1.1 认识线程 线程是轻量级进程,也是程序执行的一个路径,每一个线程都有自己的局部变量表.程序计数器(指向正在执行的指令指针)以及各自的生命周期,现代操作系统中一般不止一个线程在运行.比如说,当我们 ...