`

js问题:document.getElementById 为null的解决方案

阅读更多

在IE8下运行如下代码,出现document.getElementById缺少对象的问题。

<html>
 <head>
  <title> Javascript问题测试</title>  
  <script language="javascript">  		
		function test(){
			alert(document.getElementById("b"));
		}
		test();
  </script>
 </head>
 <body>
	<div id="a">
		<span id="b">测试</span>
	</div>	
 </body>
</html>

 

运行结果如图: 

 

解决方案:把JS代码放在要获取的元素的后面

<html>
 <head>
  <title> Javascript问题测试</title>  
  
 </head>
 <body>
	<div id="a">
		<span id="b">测试</span>
	</div>
	<script language="javascript">  		
		function test(){
			alert(document.getElementById("b"));
		}
		test();
	</script>
 </body>
</html>

 

总结:出现问题的原因是 HTML 从上至下 解析 , 应该先 有"对象" ,再去"引用".

 
  • 大小: 4.1 KB
1
1
分享到:
评论
发表评论

文章已被作者锁定,不允许评论。

相关推荐

    TypeError document.getElementById(...) is null错误原因

    `TypeError: document.getElementById(...) is null` 是一个常见的JavaScript错误,通常出现在尝试访问一个尚未加载或者不存在于DOM(文档对象模型)中的元素时。这个错误表示`document.getElementById`方法未能找到...

    document.getElementById获取控件对象为空的解决方法

    总结一下,当遇到 `document.getElementById` 返回空值的问题时,可以考虑以下几个解决方案: 1. 检查 ID 是否拼写错误或重复,确保所引用的 ID 是唯一的且存在于 HTML 中。 2. 确认 JavaScript 代码是否在目标元素...

    Js内存泄漏及解决方案.pdf

    解决方案是在适当的时机将引用设置为null: ```javascript window.onunload: document.getElementById('myDiv').myProp = null; ``` 2. DOM闭包(Closures)和循环引用 在某些情况下,闭包中的某些变量可能会造成...

    document.getElementById为空或不是对象的解决方法

    为了解决`document.getElementById`返回值为空或不是对象的问题,我们可以采取以下几种方法: 1. 使用`defer`属性。通过给`&lt;script&gt;`标签添加`defer`属性,可以保证该脚本在文档解析完毕之后执行。`defer`属性表示...

    JS浏览器兼容问题总结

    2. **增强通用性**:这种方式可以在所有浏览器中正常工作,提供了一种更稳定的解决方案。 通过以上分析和解决方法,我们可以有效地解决JavaScript在不同浏览器之间遇到的兼容性问题,从而确保代码能够在多种环境中...

    前端常见内存泄漏及解决方案 (2).docx

    ### 前端常见内存泄漏及解决方案 #### 内存泄漏概述 内存泄漏是指系统进程中不再使用的内存未能得到及时释放的现象。这种情况会导致内存占用率逐渐升高,严重时可能影响系统性能甚至导致进程崩溃。现代浏览器如...

    JavaScript中解决多浏览器兼容性23个问题的快速解决方法

    在前端开发中,由于各种浏览器对JavaScript的支持程度和实现细节各不相同,常常会导致一些兼容性问题。这些问题如果不妥善处理,可能会影响到页面的正常显示和功能的正常使用。本文将围绕JavaScript中的多浏览器兼容...

    li:hover的解决方案

    ### IE6中的`li:hover`问题及解决方案 #### 背景介绍 早期浏览器的兼容性问题一直是前端开发者面临的一大挑战。特别是在Internet Explorer 6(简称IE6)中,由于其对CSS支持的限制,很多现代网页设计效果都无法正常...

    JavaScript参考教程

    2. Promise:解决了回调地狱,提供了链式调用的解决方案。 3. async/await:基于Promise的新特性,使异步代码更接近同步风格。 模块化: 1. CommonJS:Node.js环境中的模块系统,通过require导入模块,module....

    Js内存泄漏及解决方案

    ### Js内存泄漏及解决方案 #### 一、理解内存泄漏 在JavaScript中,内存泄漏是指由于某种原因导致不再使用的变量或对象仍然占据着内存空间,从而无法被垃圾回收机制(Garbage Collection, GC)释放,这将导致应用...

    常见的JavaScript内存泄露原因及解决方案.docx

    ### 常见的JavaScript内存泄露原因及解决方案 #### 引言 在现代Web开发中,JavaScript已成为构建复杂用户界面的主要编程语言之一。随着应用程序变得越来越庞大与复杂,有效地管理和优化内存成为确保应用性能和用户...

    javascript在firefox与ie下的兼容性总结

    以下是一些常见的兼容性问题及其解决方案: 1. **Document.form.item 问题** - 问题描述:在IE中,可以通过`document.formName.item("itemName")`来访问表单元素,但在Firefox中不支持。 - 解决方法:改为使用`...

    js在IE和fireFox的区别

    ### JavaScript在Internet Explorer (IE) 和 Firefox 中的区别与解决方案 #### 一、获取HTML元素的方式差异 1. **通过ID获取元素**: - **IE**:支持`document.getElementById`和`document.all`两种方式。 - ...

    js在IE和Firefox不同之处

    下面将详细介绍这些不同之处,并提供相应的解决方案。 #### 1. `document.form.item`问题 在IE中,可以通过`document.formName.item("itemName")`这种方式访问表单元素。但在Firefox中,这种方法无法正常工作。...

    js代码大全

    本资料包“js代码大全”旨在为初学者提供全面的JavaScript学习资源,帮助他们从菜鸟阶段逐渐成长为编程高手直至精英。 JavaScript语法基础: 1. 变量:JavaScript使用var、let或const声明变量,遵循弱类型系统,...

    IE与FF脚本兼容性问题

    #### 二、具体问题及解决方案 ##### 1. `document.form.item` 问题 **现有问题:** 在现有代码中经常会出现 `document.formName.item("itemName")` 这样的语句,这种语法只能在IE中运行,在FF中会报错。 **解决...

    【JavaScript源代码】js实现调用网络摄像头及常见错误处理.docx

    本文旨在总结这些常见问题,并提供相应的解决方案。 #### 基础代码 首先,我们来看看如何使用JavaScript的基础API——`navigator.mediaDevices.getUserMedia()`来实现摄像头流的获取和展示: ```javascript ...

    js弹出自定义层

    在JavaScript编程中,...通过不断优化和完善,你可以创建出符合项目需求的高效、优雅的弹出层解决方案。标签"js弹出层"也表明这是JavaScript中关于用户界面动态交互的一个重要知识点,对于提升用户体验有着重要作用。

    JavaScript

    2. Angular:Google维护的一个全面的前端框架,提供了完整的解决方案。 3. Vue.js:轻量级的MVVM框架,易于学习,上手快速,受到开发者喜爱。 JavaScript持续发展: 随着Web技术的进步,JavaScript也在不断进化,...

    获取iframe值 文件下载

    #### 四、兼容多种浏览器的统一解决方案 为了使代码能够同时兼容IE和Firefox等浏览器,可以采用如下的统一写法: ```javascript function testW() { var obj = null; // 尝试获取iframe内部元素的值 if (window...

Global site tag (gtag.js) - Google Analytics