用 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. 【从零开始自制CPU之学习篇04】电容

    电解电容: 多数在1μF以上,直接用数字表示.如:4.7μF.100μF.220μF等等.这种电容的两极有正负之分,长脚是正极. 独石电容: 独石电容器是多层陶瓷电容器的别称, 简称MLCC 读数方法 ...

  2. Quartz.NET学习笔记（二） Job和JobDetails

    Job和JobDetails的关系 接一篇的例子 ISchedulerFactory schedFact = new StdSchedulerFactory(); IScheduler sched = ...

  3. 从锅炉工到AI专家(9)

    无监督学习 前面已经说过了无监督学习的概念.无监督学习在实际的工作中应用还是比较多见的. 从典型的应用上说,监督学习比较多用在"分类"上,利用给定的数据,做出一个决策,这个决策在有 ...

  4. 通过LRU实现通用高效的超时连接探测

    编写网络通讯都要面对一个问题,就是要把很久不存活的死连接清除,如果不这样做那死连接最终会占用大量内存影响服务运作!在实现过程中一般都会使用ping,pong原理,通过ping,pong来更新连接的时效 ...

  5. 按行切割大文件（linux split 命令简版）

    按行切割大文件(linux split 命令简版) #-*- coding:utf-8 -*- __author__ = 'KnowLifeDeath' ''' Linux上Split命令可以方便对大 ...

  6. JDK源码分析（4）之 LinkedList 相关

    LinkedList的源码大致分三个部分,双向循环链表的实现.List的API和Deque的API. 一.定义 public class LinkedList<E> extends Abs ...

  7. linux rsync 实际应用

    linux rsync 实际应用 一.rsync的概述 rsync是类unix系统下的数据镜像备份工具,从软件的命名上就可以看出来了——remote sync.rsync是Linux系统下的文件同步和 ...

  8. .Net Core SDK 命令介绍

    前言 本篇主要介绍 asp.net core 中,使用 dotnet tools 运行 dotnet run 之后的系统执行过程. 如果你觉得对你有帮助的话,不妨点个[推荐]. 目录 dotnet r ...

  9. Spring Boot（九）Swagger2自动生成接口文档和Mock模拟数据

    一.简介 在当下这个前后端分离的技术趋势下,前端工程师过度依赖后端工程师的接口和数据,给开发带来了两大问题: 问题一.后端接口查看难:要怎么调用?参数怎么传递?有几个参数?参数都代表什么含义? 问题二 ...

  10. Gartner 2018 数据库系列报告发布 巨杉数据库连续两年入选

    近期,Gartner陆续发布了2018年的数据库系列报告,包括<数据库魔力象限><数据库核心能力>以及<数据库推荐报告>.其中,SequoiaDB巨杉数据库作为业界 ...