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

一.
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>

赞 (0)

相关推荐

  • Document和Document.all区别分析

    123456 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 如果与a,form对象,image对象,applet对象相对应的html标记中设定了name性质,它的值将被用作document对象的属性名,用来引用相应的对象,其他的对象则不可以. 另外,input等如果作为form的子元素,则直接用inputName或者document.inputName来引用此对象就是错误的,必须使用formName.inputName引用,否则就可以使用inputName来引用. 另外应该注意到有

  • 再谈ie和firefox下的document.all属性

    例如下面的代码: 复制代码 代码如下: <html> <body> <SCRIPT LANGUAGE="JavaScript"> <!-- if(document.all) alert("this is a IE"); else alert("this is a Mozilla"); //--> </SCRIPT> </body> </html> 在IE浏览器会输

  • 解决 firefox 不支持 document.all的方法

    今天为Kinoko-World写v2版,遇到了点js的小问题.document.all在firefox下不支持,上网搜索了一下, 用 document.getElementsByTagName("*") 替代就OK了. getElementsByTagName("*") 可以得到得到所有元素的集合 getElemntById 可以按id得到某一元素 getElementsByName 可以得到按name属性得到某一元素 getElementById效果更好啊

  • js中document.getElementByid、document.all和document.layers区分介绍

    document.all是IE 4.0及以上版本的专有属性,是一个表示当前文档的所有对象的娄组,不仅包括页面上可见的实体对象,还包括一些不可见的对象,比如html注释等等.在document.all数组里面,元素不分层次,是按照其在文档中出现的先后顺序,平行地罗列的.所以可以用数字索引来引用到任何一个元素.但比较常用的是用对象id来引用一个特定的对象,比如document.all["element"]这样. document.layers是Netscape 4.x专有的属性,是一个代表

  • document.all与WEB标准

    1.DOM WEB标准现在可真是热门中热门,不过下面讨论的是一个不符合标准的document.all[].DOM--DOCUMENT OBJECT MODEL文档对象模型,提供了访问文档对象的方法.例如文档中有一个table,你要改变它的背景颜色,那就可以在javascript中用document.all[]访问这个TABLE.但DOM也有所不同,因为浏览器厂商之间的竞争,各浏览器厂商都开发了自己的私有DOM,只能在自己的浏览器上正确运行,document.all[]就是只能运行在 IE是的微软

  • document 和 document.all 分别什么时候用

    document 和 document.all 分别什么时候用

    <body> <div id="aa">123456</div> <input type="button" value="这里用 document 就出错" onclick="alert(document.aa.innerText);" /> <br /> <input type="button" value="这里用 docume

  • document.all还是document.getElementsByName?

    复制代码 代码如下: (wuhen注:document.all是ie特有的属性,不是万维网标准) 当页面上的控件同名且多个的时候,你首先做的是什么?判断长度?的确,从程序的严密角度出发,我们是需要判断长度,而且有长度和没长度是两种引用方法.我们来看: oEle= document.all.aaa ;//这里有一个aaa的对象,但我们不知道它现在长度是多少,所以没办法对它操作.因此,我们要先做判断长度的过程.如下: if(oEle.length){}else{}; 在两种情况下,花括号里面的内容写

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

    一. 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>

  • PHP实现一个多功能购物网站的案例

    PHP实现一个多功能购物网站的案例

    一.需要实现的页面: Index.aspx:浏览商品页面,显示商品列表,用户可以点击"加入购物车". ViewCart.aspx:查看购物车页面,显示已购买的商品信息,可以点击"删除"和"提交添加订单购买"商品 ViewAccount.aspx:查看个人账户余额 Login.aspx:登录页面 二.实现功能: 1.显示商品列表 2.实现购买功能,购买的时候动态显示购物车中的商品数量和商品总价格 3.点击查看购物车后,显示已购买的商品.注意&quo

  • vue 实现一个简单的全局调用弹窗案例

    1.实现效果图 2.第一步,新建一个.vue文件 定义一个弹框的基本模板 style样式放在了文章的最底部,如果需要看效果,需要将样式放入这个vue文件里,样式是用less写的,需要你的项目引入less 注意:我这里的组件右上角关闭是一张图片 需要换成你自己本地的路径 <template> <div id="tip_alertModal"> <div class="t-alert-mask"></div> <di

  • 一个string类的简单实现案例

    string类中使用到了赋值构造函数.复制构造函数.构造函数.默认构造函数.析构函数.重载操作符等一些类操作 class String { public: String() { data = new char[1]; //这里为什么使用new char[1]呢,虽然是一个字符,这是为了和析构函数保持对称,因为在别的构造函数中使用的char[] data[0]='\0'; length = 0; } String(const char* str) { length = strlen(str); d

  • Java实现一个简单的文件上传案例示例代码

    Java实现一个简单的文件上传案例 实现流程: 1.客户端从硬盘读取文件数据到程序中 2.客户端输出流,写出文件到服务端 3.服务端输出流,读取文件数据到服务端中 4.输出流,写出文件数据到服务器硬盘中 下面上代码 上传单个文件 服务器端 package FileUpload; import java.io.FileOutputStream; import java.io.IOException; import java.io.InputStream; import java.net.Serve

  • 封装一个Vue文件上传组件案例详情

    封装一个Vue文件上传组件案例详情

    目录 前言 1. 子组件 2 父组件使用 3.效果 4.总结 前言 在面向特定用户的项目中,引 其他ui组件库导致打包体积过大,首屏加载缓慢,还需要根据UI设计师设计的样式,重写大量的样式覆盖引入的组件库的样式.因此尝试自己封装一个自己的组件,代码参考了好多前辈的文章 1. 子组件 <template> <div class="digital_upload"> <input style="display: none" @change=&

  • SQL+HTML+PHP 一个简单论坛网站的综合开发案例(注册、登录、注销、修改信息、留言等)

    1 实验环境 (1)服务端:本实验基于虚拟机win2008系统的WAMP环境进行,该环境相关配置过程参考文章<[语言环境]WAMP环境部署及优化—以win2008R2SP1为操作系统>.(2)客户端:使用浏览器访问与控制.(3)服务端与客户端处于同一个局域网下,开启服务端的phpstudy并确保能从客户端浏览器访问. 2 网站页面功能规划 写一个网站,在首页能看用户的留言,同时能实现包括用户注册.登录.注销.上传头像.修改个性签名等.其中网站的所有代码文件均放在默认站点位置下的文件夹jrltb

  • 如何使用proxy实现一个简单完整的MVVM库的示例代码

    前言 MVVM 是当前时代前端日常业务开发中的必备模式(相关框架如react,vue,angular 等), 使用 MVVM 可以将开发者的精力更专注于业务上的逻辑,而不需要关心如何操作 dom.虽然现在都 9012 年了,mvvm 相关原理的介绍已经烂大街了,但出于学习基础知识的目的(使用 proxy 实现的 vue3.0 还在开发中), 在参考了之前 vue.js 的整体思路之后,自己动手实现了一个简易的通过 proxy 实现的 mvvm. 本项目代码已经开源在github,项目正在持续完善

  • JS document内容及样式操作完整示例

    JS document内容及样式操作完整示例

    本文实例讲述了JS document内容及样式操作.分享给大家供大家参考,具体如下: <html> <head> <title>js-documnet元素内容和样式操作</title> <meta charset="UTF-8"/> <script type="text/javascript"> // 单标签属性操作 // 固定属性的操作 function testOper1(){ // 获取对

  • 分析一个MySQL的异常查询的案例

    问题 用户工单疑问:相同的语句,只是最后的limit行数不同.奇怪的是,limit 10 的性能比limit 100的语句还慢约10倍. 隐藏用户表信息,语句及结果如下 SELECT f1 , SUM(`f2`) `CNT` FROM T WHERE f1 IS NOT NULL AND f3 = '2014-05-12' GROUP BY f1 ORDER BY `CNT` DESC LIMIT 10; 执行时间3 min 3.65 sec SELECT f1 , SUM(`f2`) `CNT

随机推荐