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

最新推荐文章于 2022-12-19 11:37:19 发布
置顶 最新推荐文章于 2022-12-19 11:37:19 发布
阅读量1.5k 收藏
点赞数
分类专栏： javascript 文章标签： document.getelementb 缺少对象
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/w15454/article/details/25471437
版权 

下面这段代码浏览器端运行时会报错：缺少对象
原因是：在还未加载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>
注：源代码片段来自传智播客韩老师的课堂代码。错误为本人遇到。觉得很有价值，和大家分享
w15454
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
document.frames不兼容火狐的问题
panzheng0920的专栏
01-15 622
  document.frames不兼容火狐的问题 获取页面中嵌入的iframe的对象时，使用document.frames('testFrame').document或者document.frames['testFrame']来获得id为testFrame的iframe的DOM对象时，用火狐调试的时候，提示document.frames is not a function，因此火狐是不支持...
document.getElementById获取控件对象为空的解决方法
09-04
今天写个网页，想在页面加载onLoad时，动态显示由后台其他程序传来的数据时，用document.getElementById获取控件对象总是为空。但是检查了这个id确实是存在的。看下文的示例和解决方法
document.getElementBy系列方法获取不到对象
weixin_44848356的博客
02-13 3269
getElementById取不到对象 在浏览器进行文档解析时是有顺序的，当页面加载完毕之前，或者说在相应的DOM对象加载完毕之前，对应的对象是不能获取到的。 看下面代码： <script> var temp = document.getElementById("div"); alert(temp); </script> <body> <d...
为什么JS中的方法getElementById()老是找不到对象？
一只黑猫学JAVA
03-12 1560
如题，一个引入JSP页面中的JS文件，其中几乎所有的getElementById（）方法突然间都找不到对象了。之前运行正常，就是在一次更新系统后突然出现。研究了一上午到现在也不知道为什么。。。 哪位遇到过一样的问题知道怎么回事吗？ PS：测试人员将文件用以前的备份更新后就好了。。。 补：页面只加载出一小部分，难道是因为那些有id的部分的页面还没加载导致的？ 为什么页面会加载一小部分就显...
$(document).ready 缺少对象
kebikakaxi的专栏
10-29 2573
今天做把页面的js代码全部放到js文件中。之后出现“缺少对象”的错误。 原来导入引入js时要先引入jquery的js 如下 JS/jquery-1.8.0.js"> JS/feedback.js"> 如果顺序反了，就会提示错误。以前没注意这个，花费我半小时时间啊！ 总结：js找错太恶心了
document.getElementById获取不到标签
Rockandrollman的博客
11-12 1681
如果你是把 document.getElementById写在了内，可能会由于页面没有完全加载所以获取不到指定标签。 把 document.getElementById…写在body标签后面就可以了。 <body> </body>//写到body下面 <script type="text/javascript"> document.getElementById("qx").style.display = "none"; </script> ..
document.getElementById("demo").innerHTM
05-16
这是一段 JavaScript 代码，但是它不完整，缺少了最后的分号和结束括号。应该是： ```javascript document.getElementById("demo").innerHTML; ``` 这段代码的作用是获取 id 为 "demo" 的 HTML 元素的 innerHTML ...
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>页面跳转</title> <style> </style> </head> <body> <input type="button" value="节点" onclick="jiedian()"> </body> <script> function jiedian(){ var d = document.createElement("div"); // 文本要显示的内容 var t = document.createTextNode("hello"); // 连接文本 d.appendChild(t); // 放置节点 var b1 = document.getElementById("b1"); // b1.appendChild(d); var but = document.getElementById("but1"); b1.insertBefore(d,but); }; </script> </html> 代码有何问题
最新发布
05-27
2. 在JavaScript中，`getElementById`方法使用了不存在的元素ID。 3. `insertBefore`方法使用了不存在的元素ID。 修改后的代码如下： ``` <!DOCTYPE html> 页面跳转 节点" onclick="jiedian()"> ...
JS脚本运行缺少对象
07-25
标题与描述：“JS脚本运行缺少对象”，这一问题在网页开发和维护中较为常见，主要表现为JavaScript脚本在执行过程中因找不到预期的对象而引发错误。这种情况不仅会影响网页的正常加载和功能实现，还可能导致用户体验...
chrome插件的js中使用document.getElementById(‘save‘)获取不到元素
12-19 2713
使用Store0请输入消费金额:存储
document.getElementById获取不到对应值，返回NUll
gigijingjing的博客
06-20 8413
问题：当把js文件引入位置放到head标签内，document.getElementById获取不到对应值，返回NUll； 原因：html代码执行顺序问题获取不到元素值； 解决办法： 第一种：加上defer属性。<script type="text/javascript" src="form.js" defer="defer"></script> 第二种：把...
vue v-else中使用document.getElementById获取不到值的问题
Spy003的博客
08-20 3245
然后我尝试，把含有id组件写在v-if中，这时可以获取到组件了，但是当v-else的组件显示出来以后，发现同一个位置，v-else页面控件对应的位置也能获取到这个id，于是我发现，：我把含有id的标签写在了v-else中，结果，通过document.getElementById获取不到组件，这个问题困扰了我两天，我经过反复排查，终于定位到了问题出现在v-if / v-else 判断属性中，vue v-else中使用document.getElementById获取不到值的问题。
HTML getElement等方法时未找到对象时的可能原因
qq_39385997的博客
10-12 490
HTML getElement等方法时未找到对象时的可能原因 搜索的值不对应 如getElementById( bid )时，bid与body中元素所对应的id不对应，这自然找不到了。 函数不等所需资源加载完就直接调用 &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;getElementId Test&lt;/title...
在JavaScript中使用document.getElementById()获取对象失败的原因
回忆
04-21 2万+
在JavaScript中使用以下方法 document.getElementById()getElementsByName()getElementsByTagName() 等等类似方法获取元素对象的时候，一定要切记： 一定一定要在你所要获取的元素对象加载以后才调用以上方法。否则根本获取不到该对象。 我在学习的时候就遇到了相似情况，纠结了好多时间：代码如下 计时器
html中ID取val值,document.getElementById获取不到值的原因及解决办法
weixin_36058835的博客
06-18 3268
document.getElementById获取不到值的原因及解决办法在html中如下一段源代码：document.getElementById("getText").value="你好";helloDW(Dreamweaver)测试无任何错误提示，但标签中的内容没有改变在EditPlus中测试直接出现如下图所示的错误点击是只有一个hello 出现的结果在DW中一样，只是这里报错说明问题出现在g...
js的document.getElementById()不起作用的原因，显示null
weixin_59129994的博客
10-20 5934
发现这里的document.getElementById()根本没有获取到对象！就把下面这行代码移到了 的最后一行。
document.getElementById获取不到值的几种原因分析
热门推荐
java journey
09-23 5万+
前几天修改那个分页类，想加入跳转到指定页的功能，就是用户直接输入页码，点击按钮就可以跳到指定的页码！     一看这个需求，就可以想到利用GET传值的方式，但常规GET方式需要把链接写入标签的a href里面，而我们实际上是希望用按钮来进行点击，而不是一个简单的超链接形式。于是
document.getElementById()获取一直为null
慕白Lee的博客
10-20 1万+
document.getElementById()获取一直为null的最常见的一个原因是js文件在head标签里。直接使用$("#duang")同样可以获得对象进行一系列操作, 但是同样需要注意ID的正确性。产生的加载顺序问题，导致get不到节点的信息.
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值