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

开发者福利!热门AI工具限时免费用 购周边即赠Coding Plan Lite,Claude Code、Cursor等20+工具畅享,效率翻倍! 阅读详情
今天写个网页,想在页面加载onLoad时,动态显示由后台其他程序传来的数据时,用document.getElementById获取控件对象总是为空。但是检查了这个id确实是存在的。看下文的示例和解决方法

1.下面是一个简单的例子,页面加载时显示一段信息

 代码如下:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
      <script language="javascript">
          alert("hello!!!");
      </script>
  </head>

  <body onLoad="showMessage()">
      <h1>在页面加载之前,会输出一些信息</h1>
  </body>
</html>

执行后,确实是“在页面加载前,输出了信息”。
2.下面的例子会出现document.getElementById为空的情况。
我的计划是:在页面加载时,在<body></body>的文本框中显示由后台处理来的数据,比如这里的字符串“hello, my friend!”。但是这里通过通过document.getElementById读取的是对象为空。
因为onLoad方法在页面<body></body>加载之前执行,此时id="mes"对应文本框的文本框,还没有加载进去。
unity3d http://www.unitymanual.com/
 代码如下:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
      <script language="javascript">
          var t=document.getElementById("mes");
          t.value="hello, my friend!"
      </script>
  </head>

  <body onLoad="showMessage()">
      the message is:<input type="text" id="mes">
  </body>
</html>

3.解决办法
在加载Html网页时,会加载<html></html>中的所以数据。先加载<head>,再加载<body>。
所以我们可在</body>之后,在</html>之前写入javascript就好了。程序顺序执行,执行到相应的javascript调用就可以执行。不是用onLoad方法。
代码如下:

 代码如下:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <body>
          the message is:<input type="text" id="mes">
    </body>

      <!-- 继续执行javascript代码 -->
    <script language="javascript">
          function showMessage()
          {
              var t=document.getElementById("mes");
              t.value="hello, my friend!"
          }
          showMessage();    //调用方法,更新文本框
      </script>
</html>
JavaScript技巧:解决document.getElementById或不是对象的问题 这是因为在解析HTML页面时,浏览器会按照从上到下的顺序执行代码。这样,在页面完全加载后,JavaScript代码将执行,并且。// 正确示例:获取元素的代码位于window.onload事件处理函数中。的参数(元素的ID)拼写错误,或者页面中没有该ID的元素。标签的底部,或者将代码放在外部JavaScript文件中,并在。的参数是正确的,并且确保页面中存在该ID的元素。为或不是对象的问题,并成功获取所需的元素。事件处理函数中,确保在页面完全加载后执行。通过上述修改,我们将获取元素的代码放在。 阅读详情

相关推荐

写给音响工程师的科普文章(二)——从模电角度去了解调音台话放

    上一篇讲到调音台第一级放大电路为差分放大器,关于差分放大器的基础知识可以参考以下资料:https://wenku.baidu.com/view/e6a46aaa2af90242a995e537 在教材中的差分放大器基本形式是这样子的,在实际电路中把RE电阻换成两个2倍RE,于是变成这样 然后我们现在来对比调音台中的差分放大器和教材中的有什么区别,我就拿yamaha 01V 96来说...

huanghaoAudio的博客 7660

el-table全部展开和全部折叠子菜单功能

// 展开 expandAll() { let els = document.getElementsByClassName('el-table__expand-icon') if (this.tableData.length !== 0 && els.length !== 0) { for (let j = 0; j < els.length; j++) { els[j].classList.add('dafult') .

qq_307183846的博客 1145

我从华为身上学到的项目管理经验 -- 需求篇

记录这三年,关于项目管理上的一些心得体会 – 需求篇对于需求,我们可以根据不同的角色、理解拆分成三个过程:简单来说就是:需求分析原始需求、 需求拆分为系统需求、 需求实现为功能需求**需求分析**: 将客户需求 输出成 需求描述。 需求经理需要把 需求 转换成 客户能够接受的 初始需求 IR(Initial Requirement) 对于用户来说,我只管提 我的原始需求是

minminzhe520的博客 3万+

求 window.parent.document.getElementById(...)为或不是对象解决办法。

function forder13(id,v,tablename,fname,gname,str5) { ? ? ? ? str=''; ? ? ? ? str2=''; ? ? ? ? //alert(str2); ? ? ? ? $("#"+str5+id).html(str2); ? ? ? ? ? ? ? ? ? ? ? $("#kk"+id).focus();

xuanxiangpu4520的博客 5579

document.getElementById(...)' 为或不是对象

将script代码写入body标签中。置于head中的javascript代码在浏览器解析时生成的DOM中,而其中所取的Element出现在浏览器生成的DOM的body中,页面js被执行时,因为这个Element在执行语句之后,所以就会找不到此Element,从而报对象或不是对象这个错误。

Nothing的专栏 1036

获取HTML元素3个方法document.getElementsByName()、document.getElementById()、document.getElementsByTagName()

获取HTML元素3个方法比较:document.getElementsByName()、document.getElementById()、document.getElementsByTagName() document.getElementsByName() 是根据控件名称获取这个控件对象,因为控件名称可以相同,返回的是一个对象数组。 document.getElementBy...

小哥骑单车 6万+

document.getElementById 学习总结

document.getElementById获取控件对象解决方法   1.下面是一个简单的例子,页面加载时显示一段信息 代码如下:                   alert("hello!!!");                 在页面加载之前,会输出一些信息   执行后,确实是“在页面加载前,输出了信息”

bcbobo21cn的专栏 3万+

document获取页面控件的标签对象

document.getElementsByName()与  document.getElementById()、  document.getElementsByTagName()的区别是什么? document.getElementsByName()    是根据控件名称获取这个控件对象,因为控件名称可以相同,返回的是一个对象数组。 document.getElementById()  

ryan1214的专栏 2229

当innerHTML遇上document getElementById

当innerHTML遇上document getElementById

qq_44894359的博客 1120

js中document.getElementById()用法

dom标准里面的  获取当前文档中指定id的元素 if (document.getElementById("regjm").value != document.getElementById("regjm1").value ) {    alert("提示:请输入有效的认证码");    document.getElementById("regjm1").focus();    retur

lyhmyway的专栏 6万+

document.getElementById()获取服务端控件

今天敲代码的时候,发现用document.getElementById()获取不到服务端控件,在CSDN里找了找,在http://topic.csdn.net/u/20090224/09/db235c8a-3723-4430-9b41-9337dfd5e0b9.html找到了原因:服务器端控件有3个ID,分别为ID,UniqueID,ClientID,解释成html控件后 id名称会变化,所以要这样用:var textbox = document.getElementByID(""); 但是我这样用了之后,

idonotknowwhatislife的专栏 3718

当innerHTML遇上document.getElementById

      不知在通常的开发中,大家有没有遇到过这样的问题。      例如现在有一个控件 ,如果想取这个控件的值有很多中方法,其中document.getElementById(name).value既是其中的一种。但是在实际的开发中可能碰到使用这个方法取不到值的情况。为了解决这个问题,我们有必要明白document.getElementById()这个函数的原理。      这个函

snowteng17的专栏 4771

document.getElementsByName() 、document.getElementById() 、document.getElementsByTagName() 区别

document.getElementsByName() 是根据控件名称获取这个控件对象,因为控件名称可以相同,返回的是一个对象数组。 document.getElementById() 是根据控件ID获取这个控件对象,因为控件ID唯一,返回的是一个对象document.getElementsByTagName() 是根据控件TAG获取这个控件对象,返回的是一个对象数组。...

Hurricane_m的博客 1746

document.getElementsByName()与 document.getElementById()、 document.documentElement.getElementsByTagN

document.getElementsByName()与 document.getElementById()、 document.documentElement.getElementsByTagName的区别 2008-12-18 11:43 223人阅读 评论(0) 收藏 举报 document.getElementsByName()       是根据控件名称(name属性)

1065

document.getElementsByName()与 document.getElementById()、document.getElementsByTagName()的区别

document.getElementsByName() 是根据控件名称获取这个控件对象,因为控件名称可以相同,返回的是一个对象数组。document.getElementById() 是根据控件ID获取这个控件对象,因为控件ID唯一,返回的是一个对象document.getElementsByTagName() 是根据控件TAG获取这个控件对象,返回的是一个对象...

aku70144的博客 301

js中document通过ID获取的一些使用方法

js中document通过ID获取的一些使用方法 document.getElementById("link").href; document.getElementById("link").target; document.getElementById("img").src; document.getElementById("img").width; document.getElementById("img").height; document.getElementById("input"...

妃宫千早 3237
上一篇: PHP MYSQL注入攻击需要预防7个要点
下一篇: javascript 循环调用示例介绍
GMY20
博客等级 码龄15年 14粉丝 139原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值