当前位置: 首页 > 图文教程 > 网络编程 > Javascript > document.all与getElementById、getElementsByName、getElementsByTagName用法区别-document.all

Javascript
在一个form用一个SUBMIT(或button)分别提交到两个处理表单页面的代码
用Javascript读取中文COOKIE的解决办法
功能很全的精品JS计算器
永不消失的title提示代码
一直复略了的一个问题，关于表单重复提交
初探jquery——表单应用范例
懒就要懒到底——鼠标自动点击（含时间判断）
关于表单的两点交互体验改进技巧
javascript知识点收藏
用Javascript做flash做的事..才完成的一个类.Auntion Action var 0.1
如何使页面打开时input就被选中？
点选TOP后并不是直接跳到页顶的，而是滚动上去的
js玩一玩WSH吧
【最新漏洞】IE中使用Rds.DataSpace下载并运行病毒文件
select选择事件问题
SUN的《AJAX与J2EE》全文译了
你真的了解JavaScript吗？
极酷的javascirpt，让你随意编辑任何网页
用javascript编写的第一人称射击游戏
轻轻松松学习JavaScript

No. « 49 50 51 52 »

技术文章搜索

关键字

Javascript 中的 document.all与getElementById、getElementsByName、getElementsByTagName用法区别-document.all

出处:互联网   整理: 软晨网（RuanChen.com）   发布: 2009-09-12   浏览: 453 ::
收藏到网摘: n/a

Document.all[]是文档中所有标签组成的一个数组变量，包括了文档对象中所有元素

理解这句话可看以下：
例1（这个可以让你理解文档中哪些是对象）
　　

点击运行可以看到效果:
[Ctrl+A 全选 提示:你可先修改部分代码,再按运行]
[/code]
document.all可以判断浏览器是否是IE
if(document.all){
alert("is IE!");
}
使用document.all注意的地方
代码1:
复制代码 代码如下:

<input name=aaa value=aaa>
<input id=bbb value=bbb>
<script language=Jscript>
alert(document.all.aaa.value) //根据name取value
alert(document.all.bbb.value) //根据id取 value
</script>

代码2：
但是常常name可以相同(如:用checkbox取用户的多项爱好的情况)
复制代码 代码如下:

<input name=aaa value=a1>
<input name=aaa value=a2>
<input id=bbb value=bbb>
<script language=Jscript>
alert(document.all.aaa(0).value) //显示a1
alert(document.all.aaa(1).value) //显示a2
alert(document.all.bbb(0).value) //这行代码会失败
</script>

代码3：
理论上一个页面中的id是互不相同的，如果出现不同tags有相同的id
复制代码 代码如下:

document.all.id 就会失败,就象这样：
<input id=aaa value=a1>
<input id=aaa value=a2>
<script language=Jscript>
alert(document.all.aaa.value) //显示 undefined 而不是 a1或者a2
</script>

代码4:
对于一个复杂的页面（代码很长，或者id是由程序自动产生),或着一个
javascript初学者写的程序，很有可能出现两个tags有相同id的情况。
为了编程的时候不出错，我推荐这样的写法：
复制代码 代码如下:

<input id=aaa value=aaa1>
<input id=aaa value=aaa2>
<input name=bbb value=bbb>
<input name=bbb value=bbb2>
<input id=ccc value=ccc>
<input name=ddd value=ddd>
<script language=Jscript>
alert(document.all("aaa",0).value)
alert(document.all("aaa",1).value)
alert(document.all("bbb",0).value)
alert(document.all("bbb",1).value)
alert(document.all("ccc",0).value)
alert(document.all("ddd",0).value)
</script>

这样最安全.
以下是我自己的测试：
点击运行可以看到效果:
[Ctrl+A 全选 提示:你可先修改部分代码,再按运行]

从上面可以看到我们在使用document.all的时候可能会返回一个值或多个值的情况，所以使用之前一定要判断长度，要不然会出现错误。
如下面的问题：两个函数对多个checkbox进行处理，分别执行全部选中和取消全选功能如果按下面使用会出现什么问题呢？
点击运行可以看到效果:
[Ctrl+A 全选 提示:你可先修改部分代码,再按运行]

看上面的代码，当表单中有多个checkbox的时候是没有问题的，但当其中只有一个checkbox的时候就会有问题，即点全选的时候不起作用，因为当其中只有一个checkbox的时候不再用document.all["huang"][0].checked来访问，而是直接用document.all["huang"].checked来访问了
看当只有一个checkbox的时候应改成下面代码
复制代码 代码如下:

<HTML>
<SCRIPT LANGUAGE="JavaScript">
<!--
function checkall(){
var huang = document.all['huang'];
if(huang.length){
for(i = 0;i < huang.length;i++){
if(huang[i].type == "checkbox")
{
huang[i].checked = true;
}
}
}else{
huang.checked = true;
}
}
function centerall(){
if(huang.length){
for(i = 0;i < huang.length;i++){
if(huang[i].type == "checkbox")
{
huang[i].checked = false;
}
}
}else{
huang.checked = false;
}
}
//-->
</SCRIPT>
<BODY>
<input type="checkbox" name="huang" value="OFF">
[br]
<input type="button" value = "checkall" onclick = "checkall();">
<input type="button" value = "centerall" onclick = "centerall();">
</BODY>
</HTML>

或者使用另一种形式，使用getElementsByTagName，如下：
复制代码 代码如下:

<HTML>
<SCRIPT LANGUAGE="JavaScript">
<!--
function checkall()
{
var huang = document.getElementsByTagName("input");
for(i = 0;i < huang.length;i++){
if(huang[i].type == "checkbox")
{
huang[i].checked = true;
}
}
}
function centerall()
{
var huang = document.getElementsByTagName("input");
for(i = 0;i < huang.length;i++){
if(huang[i].type == "checkbox")
{
huang[i].checked = false;
}
}
}
//-->
</SCRIPT>
<BODY>
<input type="checkbox" name="huang" value="OFF">
[br]
<input type="button" value = "checkall" onclick = "checkall();">
<input type="button" value = "centerall" onclick = "centerall();">
</BODY>
</HTML>