document.all的一个比较完整的总结及案例


Posted in Javascript onJanuary 31, 2013

一.
document.all是页面内所有元素的一个集合。例如:
document.all(0)表示页面内第一个元素
二.

document.all可以判断浏览器是否是IE 
if(document.all){ 
alert("is IE!"); 
}

三.
也可以通过给某个元素设置id属性(id=aaaa),然后用document.all.aaaa调用该元素
四.
案例:
代码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>
Javascript 相关文章推荐
基于Web标准的UI组件 — 树状菜单(2)
Sep 18 Javascript
C#中TrimStart,TrimEnd,Trim在javascript上的实现
Jan 17 Javascript
JS中setTimeout()的用法详解
Apr 14 Javascript
JavaScript必知必会(十) call apply bind的用法说明
Jun 08 Javascript
基于zepto.js简单实现上传图片
Jun 21 Javascript
AngularJS ng-controller 指令简单实例
Aug 01 Javascript
Vue.js使用v-show和v-if的注意事项
Dec 13 Javascript
JavaScript实现前端分页控件
Apr 19 Javascript
Angular2安装angular-cli
May 21 Javascript
JS实现判断有效的数独算法示例
Feb 25 Javascript
node koa2 ssr项目搭建的方法步骤
Dec 11 Javascript
React 并发功能体验(前端的并发模式)
Jul 01 Javascript
javascript对select标签的控制(option选项/select)
Jan 31 #Javascript
S2SH整合JQuery+Ajax实现登录验证功能实现代码
Jan 30 #Javascript
js+html+css实现鼠标移动div实例
Jan 30 #Javascript
DWR实现模拟Google搜索效果实现原理及代码
Jan 30 #Javascript
E3 tree 1.6在Firefox下显示问题的修复方法
Jan 30 #Javascript
js判断样式className同时增加class或删除class
Jan 30 #Javascript
编写针对IE的JS代码两种编写方法
Jan 30 #Javascript
You might like
codeigniter教程之多文件上传使用示例
2014/02/11 PHP
Prototype使用指南之dom.js
2007/01/10 Javascript
一个tab标签切换效果代码
2009/03/27 Javascript
基于jquery的下拉框改变动态添加和删除表格实现代码
2020/09/12 Javascript
基于JavaScript 类的使用详解
2013/05/07 Javascript
jquery 利用show和hidden实现级联菜单示例代码
2013/08/09 Javascript
了解了这些才能开始发挥jQuery的威力
2013/10/10 Javascript
JS上传图片前实现图片预览效果的方法
2015/03/02 Javascript
AngularJS基础学习笔记之指令
2015/05/10 Javascript
CSS或者JS实现鼠标悬停显示另一元素
2016/01/22 Javascript
基于JavaScript实现弹出框效果
2016/02/19 Javascript
vue数据双向绑定原理解析(get &amp; set)
2017/03/08 Javascript
微信小程序实战之自定义抽屉菜单(7)
2017/04/18 Javascript
vue loadmore组件上拉加载更多功能示例代码
2017/07/19 Javascript
vue-prop父组件向子组件进行传值的方法
2018/03/01 Javascript
jsonp跨域获取数据的基础教程
2018/07/01 Javascript
微信小程序云开发详细教程
2019/05/16 Javascript
JavaScript或jQuery 获取option value值方法解析
2020/05/12 jQuery
Vue左滑组件slider使用详解
2020/08/21 Javascript
python按照多个字符对字符串进行分割的方法
2015/03/17 Python
Python 正则表达式的高级用法
2016/12/04 Python
Python数据分析之双色球中蓝红球分析统计示例
2018/02/03 Python
Django自定义用户认证示例详解
2018/03/14 Python
Python对ElasticSearch获取数据及操作
2019/04/24 Python
简单了解Django ORM常用字段类型及参数配置
2020/01/07 Python
python中取绝对值简单方法总结
2020/07/24 Python
video实现有声音自动播放的实现方法
2020/05/20 HTML / CSS
总经理职责范文
2013/11/08 职场文书
《燕子》教学反思
2014/02/18 职场文书
2015大学生实训报告
2014/11/05 职场文书
2014年幼儿园学期工作总结
2014/12/05 职场文书
拾金不昧感谢信范文
2015/01/21 职场文书
Mysql MVCC机制原理详解
2021/04/20 MySQL
利用python Pandas实现批量拆分Excel与合并Excel
2021/05/23 Python
Apache Hudi的多版本清理服务彻底讲解
2022/03/31 Servers
关于Python使用turtle库画任意图的问题
2022/04/01 Python