javascript中document.getelementbyid缺少对象的问题原因

下面这段代码浏览器端运行时会报错：缺少对象

原因是：在还未加载img对象前就试图通过它的id得到img对象。

  从这个错误就可以看出Javascript和html的一些特性。

  下面是报错的代码段

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html><meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<link rel="stylesheet" type="text/css" href="mario.css" />
<head><script language="javascript"> var mymario=document.getElementById('mymario'); window.alert(mymario.style.top);</script>
</head>
<body><div class="gamediv">  <img id="mymario" src="i2.png" style="left:100px; top:50px; position:absolute;" /> <!--用到了绝对定位-->  </div> </body>
</html>

修改后

下面这段代码不会报错。原因：加载完img之后再通过它的id得到img对象

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html><meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<link rel="stylesheet" type="text/css" href="mario.css" />
<head><script language="javascript"> function show(){var mymario=document.getElementById('mymario'); window.alert(mymario.style.top);}</script>
</head>
<body><div class="gamediv">  <img id="mymario" src="i2.png" style="left:100px; top:50px; position:absolute;" /> <!--用到了绝对定位-->  </div> </body>
</html>

注：源代码片段来自传智播客韩老师的课堂代码。错误为本人遇到。觉得很有价值，和大家分享

javascript中document.getelementbyid缺少对象的问题原因相关推荐

JavaScript中的函数是对象？
函数是第一类对象(first-class object),被称为一等公民.函数与对象共存,我们也可以认为函数就是其他任意类的对象. 那么今天,就让我们一起简单聊一聊JavaScript的函数吧! 目录 ...
详谈javascript中document.referrer的兼容性
遇见了,却来不及相识:相识了,却来不及熟悉:熟悉了,却还是要说再见.既然每天都见面,为何不提前熟悉一下呢? 读书是为了明理,我们还是带着问题来了解referrer的重要性和用途吧! 一:什么是re ...
javascript中document用法
详细讲解JavaScript脚本语言的 document 对象者:整理对象属性代码 document.title //设置文档标题等价于HTML的<title> ...
JavaScript中document的用法
详细讲解JavaScript脚本语言的 document 对象者:整理对象属性代码 document.title //设置文档标题等价于HTML的<title> ...
JavaScript中的Window窗口对象【转载】
本文转载自:http://www.ijavascript.cn/jiaocheng/javascript-window-65.html 他是JavaScript中最大的对象,它描述的是一个浏览器窗口. ...
$(document).ready 缺少对象
今天做把页面的js代码全部放到js文件中.之后出现"缺少对象"的错误. 原来导入引入js时要先引入jquery的js 如下 <script type="text/j ...
js中document.getElementById(ID)与document.getElementsByName(Name)的区别
在一个HTML文档中,每个元素都可以设置ID和NAME属性.其中ID属性是唯一属性,不可以重复,一个ID值只能对应一个元素:而NAME属性是可以重复的,一个NAME值可以对应一组元素. 所以,使用do ...
javascript中的内置对象和数据结构
文章目录简介基础类型 undefined Boolean和Boolean对象 Number和BigInt String Symbol null Object Function Date Array ...
JavaScript中的地图与对象
JavaScript对象与地图 (JavaScript Objects vs Maps) Objects are super popular in JavaScript so it's not a t ...

javascript中document.getelementbyid缺少对象的问题原因

javascript中document.getelementbyid缺少对象的问题原因相关推荐

最新文章

热门文章