我用document.getElementById()的个人总结
前段做了个关于静态页面获取点击次数的程序,在做的过程中在document.getElementById()这一块出了一些问题,无论如何就是不能把从后台读取的次数输出到页面上来!后来,
我去网上查阅了一些有关document.getElementById()的用法,又参考一些大网站里的具体做法,最后终于搞定了,现在,我就把我用document.getElementById()的一点小小心得
给大家分享一下,希望能对广大的程序爱好者有所帮助!
我就用一个简单的例子来演示一下!
下面先看一组代码,这给代想要的结果是在<div></div>里输出"迷你网络地带:我出来了!"
<!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=gb2312" />
<title>document.getElement : http://www.netded.com </title>
</head>
<script>
function List()
{
document.getElementById("t1").innerHTML='迷你网络地带:我出来了!';
}
List();
</script>
<body >
<div id="t1">
</div>
</body>
</html>
如果大家运行这段代码,会发现,并没有正确的输出我们想要的效果!
我试图想利用List()函数自动调用,输出结果,但是,却没有输出任何内容!
出现这种情况的原因是我没有让document.getElementById("t1")出现在 id="t1"之后,如果我们再把程序改为以下的代码:
<!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=gb2312" />
<title>document.getElement : http://www.netded.com </title>
</head>
<body >
<div id="t1">
</div>
</body>
<script>
function List()
{
document.getElementById("t1").innerHTML='迷你网络地带:我出来了!';
}
List();
</script>
</html>
我们再运行这段代码,会发现,程序正常无误,会输出:"迷你网络地带:我出来了"
也就是说,我把在用document.getElementById()取得一个id对象时,必须在这个对象的id先出现,然后再获取!
后来,我去163的网站里看了他们的document.getElementById()的用法,发现,他们并没有把这个命令放在id对象之后,而是在之前
要是这样的话,我们的程序就要稍做一个修改,也就是把List()这个函数放到body里边,让body加载
也就是改为 <body οnlοad="List()"> 这样以来,不管document.getElementById()放在要获取的id之前还是之后,都可以正确无误了!
还有一咱情况是:当我们触发某个事件时,需要获取id对象,这个时候也不用考虑放在id之前还是之后了
如同下面的代码
<!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=gb2312" />
<title>document.getElement : http://www.netded.com </title>
</head>
<script>
function List(){
document.getElementById("t1").innerHTML='迷你网络地带:我出来了!';
}
</script>
<body >
<div id="t1">
</div>
<a href="#" οnclick="List()">请单击我</a>
</body>
</html>
当触发单击事件的时候调用List()函数,然后再输出结果:迷你网络地带:我出来了!
总结:如果要在程序加载的时候自动用document.getElementById()获取某个id对象的话,我们需要把document.getElementById()放在id之后,或者是在<body οnlοad="调用你的函数">,如果是在
某个事件触发时再获取ID对象时,就不用担心放在之前还是之后了!
document.getElementById()
最新推荐文章于 2024-08-14 16:53:41 发布