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

Javascript
动态生成select选项全接触
不刷新页面动态更新select选项，实现两个select相互操作
网页输入框日期型有效性判定一网打尽
实用Javascript函数之一(自动将输入文本框中的内容转换成大写字符)
实用Javascript函数之二(自动将输入文本框中的内容转换成小写字符)
实用Javascript函数之三(限制文本输入框中只能输入数字\"0\"到\"9\")
实用Javascript函数之四(用于对sString字符串进行前空格截除)
实用Javascript函数之五(用于对sString字符串进行后空格截除)
实用Javascript函数之六(截除字符串前后空格)
如何使用交替的滚动标题
采用DOM模型时创建一个Select节点后，要删除option项的解决方法
javascript函数速查
利用JavaScript和正则表达式进行丰富的日期判断（给其它项目组的代码，有比较好的编程风格和注释）
关于字符串的几个有用函数
FileSystemObject 的例子（处理驱动器、文件夹、文件）
用JScript实现VB.Net,C#的[委托Delegate]:
得到固定字符位置的函数
IE NC通用的藏鼠标右键一法
Menu
foolpot2001菜单

No. « 3 4 5 6 »

技术文章搜索

关键字

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

出处:互联网   整理: 软晨网（RuanChen.com）   发布: 2009-09-12   浏览: 254 ::
收藏到网摘: 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>