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 相关文章推荐
Jquery常用技巧收集整理篇
Nov 14 Javascript
ajax更新数据后,jquery、jq失效问题
Mar 16 Javascript
js 本地预览的简单实现方法
Feb 18 Javascript
PhotoShop给图片自动添加边框及EXIF信息的JS脚本
Feb 15 Javascript
jQuery实现checkbox列表的全选、反选功能
Nov 24 Javascript
Web开发中客户端的跳转与服务器端的跳转的区别
Mar 05 Javascript
JavaScript函数中的this四种绑定形式
Aug 15 Javascript
JavaScript基础之流程控制语句的用法
Aug 31 Javascript
基于vue.js的分页插件详解
Nov 27 Javascript
使用FileReader API创建Vue文件阅读器组件
Apr 03 Javascript
详解Vue的mixin策略
Nov 19 Vue.js
JavaScript中条件语句的优化技巧总结
Dec 04 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如何编写易读的代码
2007/07/10 PHP
一个简单php扩展介绍与开发教程
2010/08/19 PHP
php expects parameter 1 to be resource, array given 错误
2011/03/23 PHP
php类的自动加载操作实例详解
2016/09/28 PHP
ie 处理 gif动画 的onload 事件的一个 bug
2007/04/12 Javascript
Javascript学习笔记4 Eval函数
2010/01/11 Javascript
getComputedStyle与currentStyle获取样式(style/class)
2013/03/19 Javascript
JS限制条件补全问题实例分析
2016/12/16 Javascript
浅析为什么a=&quot;abc&quot; 不等于 a=new String(&quot;abc&quot;)
2017/10/25 Javascript
jQuery实现手风琴效果(蒙版)
2020/01/11 jQuery
vue组件创建的三种方式小结
2020/02/03 Javascript
在 Vue 中使用 JSX 及使用它的原因浅析
2020/02/10 Javascript
React+EggJs实现断点续传的示例代码
2020/07/07 Javascript
pygame实现俄罗斯方块游戏
2018/06/26 Python
Python检测数据类型的方法总结
2019/05/20 Python
python读取并定位excel数据坐标系详解
2019/06/26 Python
Python re 模块findall() 函数返回值展现方式解析
2019/08/09 Python
Python学习笔记之Zip和Enumerate用法实例分析
2019/08/14 Python
Python Django 添加首页尾页上一页下一页代码实例
2019/08/21 Python
Python实现aes加密解密多种方法解析
2020/05/15 Python
Django rest framework分页接口实现原理解析
2020/08/21 Python
纯HTML5+CSS3制作生日蛋糕代码
2016/11/16 HTML / CSS
Html5+JS实现手机摇一摇功能
2015/04/24 HTML / CSS
HTML5中input[type='date']自定义样式与日历校验功能的实现代码
2017/07/11 HTML / CSS
HTML5 移动页面自适应手机屏幕四类方法总结
2017/08/17 HTML / CSS
斯福泰克软件测试面试题
2015/02/16 面试题
材料成型专业个人求职信范文
2013/09/25 职场文书
复核员上岗演讲稿
2014/01/05 职场文书
工作个人的自我评价
2014/01/14 职场文书
志愿者服务感言
2014/02/27 职场文书
学习交流会主持词
2014/04/01 职场文书
三八红旗集体先进事迹材料
2014/05/22 职场文书
工厂仓管员岗位职责范本
2014/07/17 职场文书
安全教育片观后感
2015/06/17 职场文书
在Python 中将类对象序列化为JSON
2022/04/06 Python
vue3语法糖内的defineProps及defineEmits
2022/04/14 Vue.js