JS的document.all函数虽然被document.getElement......代替，但是在使用中还是较为常见，下面为大家详细介绍下具体的使用示例：

　　一：
　　document.all是页面内所有元素的一个集合。例如： 
　　document.all(0)表示页面内第一个元素 
　　二：
　　document.all可以判断浏览器是否是IE

                　  if(document.all){

                　　　　alert("is IE!");

                　 }

　　三：
　　也可以通过给某个元素设置id属性（id=aaaa）,然后用document.all.aaaa调用该元素

　　四：案例

　　　　代码1：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

    </head>

    <body>

        <input name="aaa" value="111">

        <input id="bbb" value="222">

        <script>

            console.log(document.all.aaa.value) //根据name取value

            console.log(document.all.bbb.value) //根据id取 value

        </script>

    </body>

</html>

　　　　代码2：

　　　　但是常常name可以相同(如:用checkbox取用户的多项爱好的情况) ；

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

    </head>

    <body>

        <input name="aaa" value="111">

        <input name="aaa" value="222">

        <input id="bbb" value="bbb">

        <script>

            console.log(document.all.aaa[0].value) //最终显示a1

            console.log(document.all.aaa[1].value) //最终显示a2

            console.log(document.all.bbb[0].value) //最终会报错

        </script>

    </body>

</html>

　　　　代码3：

　　　　理论上一个页面中的id是互不相同的，如果出现不同tags有相同的id，document.all.id 就会失败,就象这样：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

    </head>

    <body>

        <input id="aaa" value="111">

        <input id="aaa" value="222">

        <script>

            console.log(document.all.aaa.value)

        </script>

    </body>

</html>

　　　　代码4：

　　对于一个复杂的页面（代码很长，或者id是由程序自动产生),或着一个javascript初学者写的程序，很有可能出现两个tags有相同id的情况。为了编程的时候不出错，我推荐这样的写法：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

    </head>

    <body>

        <input id="aaa" value="aaa1">

        <input id="aaa" value="aaa2">

        <input name="bbb" value="bbb1">

        <input name="bbb" value="bbb2">

        <input id="ccc" value="ccc1">

        <input name="ddd" value="ddd1">

        <script>

            console.log(document.all("aaa",0).value);

            console.log(document.all("aaa",1).value);

            console.log(document.all("bbb",0).value);

            console.log(document.all("bbb",1).value);

            console.log(document.all("ccc",0).value);

            console.log(document.all("ddd",0).value);

        </script>

    </body>

</html>

?

JS的document.all函数使用示例的更多相关文章

  1. JS的document.links函数使用示例

    ? <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title&g ...

  2. JS的document.images函数使用示例

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. JS的document.anchors函数使用示例

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. js原生：封装document.getElementByClassName()函数

    //接口封装:封装document.getElementByClassName()函数function getElementsByClassName (cName,domTag,root) {//该函 ...

  5. ASP.NET前台JS与后台CS函数如何互相调用

    摘要: 在实际的Web开发中,我们可能会常常遇到后台调用前台JS代码或者前台JS调用后台代码的情况.今天就把比较实用的前后台相互调用的方法总结出来和大家分享. 在实际的Web开发中,我们可能会常常遇到 ...

  6. 【Mocha.js 101】钩子函数

    前情提要 在上一篇文章<[Mocha.js 101]同步.异步与 Promise>中,我们学会了如何对同步方法.异步回调方法以及 Promise 进行测试. 在本篇文章中,我们将了解到 M ...

  7. 多个$(document).ready()函数的执行顺序问题，（未解决）

    今天遇到了一个问题: jQuery获取不了动态添加的元素,我使用的是append添加的.寻求了帮助,得到解决方案: 在文件开头写上这样一段代码来获取,写在$(document).ready()里面. ...

  8. js两种定义函数、继承方式及区别

    一:js两种定义函数的方式及区别 1:函数声明: function sayA() { alert("i am A"); } 2:函数表达式: var sayB = function ...

  9. WebView中Js与Android本地函数的相互调用

    介绍 随着Html5的普及,html在表现力上不一定比原生应用差,并且有很强的扩展兼容性,所以越来越多的应用是采用Html与Android原生混合开发模式实现. 既然要实现混合开发,那么Js与Andr ...

随机推荐

  1. [转] webpack之plugin内部运行机制

    简介 webpack作为当前最为流行的模块打包工具,几乎所有的主流前端开发框架(React.Vue等)都会将其作为默认的模块加载和打包工具.通过简单的配置项,使用各种相关的loader和plugin, ...

  2. 【译】学习JavaScript中提升、作用域、闭包的终极指南

    这似乎令人惊讶,但在我看来,理解JavaScript语言最重要和最基本的概念是理解执行上下文.通过正确学习它,你将很好地学习更多高级主题,如提升,作用域链和闭包.考虑到这一点,究竟什么是"执 ...

  3. JS浮点计算精度问题分析与解决

    问题描述 在JS计算四则运算时会遇到精度丢失的问题,会引起诸多问题,看看以下例子: 例如:在chrome控制台输入 0.1 + 0.7 输出结果是 0.7999999999999999 例如:0.1+ ...

  4. Python_时间复杂度概念

    时间频度:一个算法中的语句执行次数称为语句频度或时间频度,记为T(n)(T代表次数,n代表问题规模) 时间复杂度:呈现时间频度的变化规律,记为T(n)=O(f(n)) 指数时间:一个问题求解所需的执行 ...

  5. Python学习（五） —— 文件操作

    一.文件操作 1.文件操作:数据持久化的一种      步骤:找到文件,打开文件,操作:读.写.追写,关闭文件      打开文件:f = open(文件路径,操作模式,编码方式),f:文件句柄.文件 ...

  6. 学号：20165239 预备作业3 Linux安装及学习

    实验三 用户及文件权限管理 之前从未接触过虚拟机,借着老师布置的任务,这次寒假初次接触了虚拟机,既紧张又兴奋,在学习了老师的一部分教程以及查阅网上的资料之后,有了以下的学习笔记和心得. 一.Linux ...

  7. 51Nod1123 X^A Mod B 数论 中国剩余定理 原根 BSGS

    原文链接https://www.cnblogs.com/zhouzhendong/p/51Nod1123.html 题目传送门 - 51Nod1123 题意 $T$ 组数据. 给定 $A,B,C$,求 ...

  8. 实现判断条件中有in的判断

    如果是简单的写sql,在where中写死就可以了,但是如果是不确定的参数呢,这个时候就需要一点处理方式了. 1.后台的写法 String[] operateResult=new String[]{&q ...

  9. oracle授权表权限给用户

    命令:grant  xxx权限 on Table to USERgrant select,insert,update,delete,all on 表名 to 用户名例如:将test表的查询权限赋予to ...

  10. union排序，起别名将两个不同的字段ZCDZ，SCJYDZ 变成同一个别名dz，进行排序；增加一个字段z，进行排序。

    with a as( select NSRSBH,NSRMC,ZGSWJ_DM,ZGSWSKFJ_DM,SSGLY_DM,FDDBRXM,ZCDZ dz,1 z from hx_dj.dj_nsrxx ...