JS的document.all函数使用示例


Posted in Javascript onDecember 30, 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 相关文章推荐
表单JS弹出填写提示效果代码
Apr 16 Javascript
JavaScript面向对象设计二 构造函数模式
Dec 20 Javascript
JavaScript表单通过正则表达式验证电话号码
Mar 14 Javascript
javascript编写实用的省市选择器
Feb 12 Javascript
javascript实现简单的html5视频播放器
May 06 Javascript
深入浅析Extjs中store分组功能的使用方法
Apr 20 Javascript
JS实现点击事件统计的简单实例
Jul 10 Javascript
使用JS中的exec()方法构造正则表达式验证
Aug 01 Javascript
vue.js学习笔记之绑定style样式和class列表
Oct 31 Javascript
Webpack打包慢问题的完美解决方法
Mar 16 Javascript
基于vue2框架的机器人自动回复mini-project实例代码
Jun 13 Javascript
Node.js使用Express.Router的方法
Nov 14 Javascript
Jquery插件easyUi表单验证提交(示例代码)
Dec 30 #Javascript
结合JQ1.9通过js正则判断各种浏览器版本的方法
Dec 30 #Javascript
Jquery中&quot;$(document).ready(function(){ })&quot;函数的使用详解
Dec 30 #Javascript
jQuery中bind,live,delegate与one方法的用法及区别解析
Dec 30 #Javascript
解析jQuery的三种bind/One/Live事件绑定使用方法
Dec 30 #Javascript
jQuery中.live()方法的用法深入解析
Dec 30 #Javascript
Javasipt:操作radio标签详解
Dec 30 #Javascript
You might like
PHP 观察者模式的实现代码
2013/05/10 PHP
laravel 4安装及入门图文教程
2014/10/29 PHP
数据结构之利用PHP实现二分搜索树
2020/10/25 PHP
JavaScript OOP类与继承
2009/11/15 Javascript
javascript 进阶篇2 CSS XML学习
2012/03/14 Javascript
JavaScript使用focus()设置焦点失败的解决方法
2014/09/03 Javascript
js实现的捐赠管理完整实例
2015/01/20 Javascript
JS控制弹出新页面窗口位置和大小的方法
2015/03/02 Javascript
使用ngView配合AngularJS应用实现动画效果的方法
2015/06/19 Javascript
js判断浏览器是否支持严格模式的方法
2016/10/04 Javascript
jquery PrintArea 实现票据的套打功能(代码)
2017/03/17 Javascript
Vue.js实现一个todo-list的上移下移删除功能
2017/06/26 Javascript
Vue利用canvas实现移动端手写板的方法
2018/05/03 Javascript
微信小程序车牌号码模拟键盘输入功能的实现代码
2018/11/11 Javascript
jQuery实现的简单歌词滚动功能示例
2019/01/07 jQuery
微信小程序-form表单提交代码实例
2019/04/29 Javascript
微信小程序中使用 async/await的方法实例分析
2020/05/06 Javascript
Python socket.error: [Errno 98] Address already in use的原因和解决方法
2014/08/25 Python
Python爬虫实现(伪)球迷速成
2018/06/10 Python
python re库的正则表达式入门学习教程
2019/03/08 Python
pyqt5 lineEdit设置密码隐藏,删除lineEdit已输入的内容等属性方法
2019/06/24 Python
python+opencv实现移动侦测(帧差法)
2020/03/20 Python
利用Python如何画一颗心、小人发射爱心
2021/02/21 Python
HTML中使用SVG与SVG预定义形状元素介绍
2013/06/28 HTML / CSS
HTML5验证以及日期显示的实现详解
2013/07/05 HTML / CSS
美国时尚配饰品牌:Dooney & Bourke
2017/11/14 全球购物
无谷物狗粮:Pooch & Mutt
2018/05/23 全球购物
C语言面试题
2013/05/19 面试题
一套英文Java笔试题面试题
2016/04/21 面试题
后进生转化工作制度
2014/01/17 职场文书
天猫活动策划方案
2014/08/21 职场文书
地球物理学专业推荐信
2014/09/08 职场文书
2014年乡镇个人工作总结
2014/12/03 职场文书
如何书写读后感?(附范文)
2019/07/26 职场文书
GoFrame框架数据校验之校验结果Error接口对象
2022/06/21 Golang
MySQL实现字段分割一行转多行的示例代码
2022/07/07 MySQL