document.all笔记
2016-01-22 13:43
246 查看
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>document.all</title>
<script type="text/javascript">
window.onload=function(){
alert(document.getElementById("wrap").length) //undefined
alert(document.getElementsByTagName("input").length); //3
}
</script>
<head>
</head>
<body>
<input type="checkbox" name="inp" value="aaa"/>
<input type="checkbox" name="inp" value="bbb"/>
<input type="checkbox" name="inp" value="ccc"/>
<div id="wrap"></div>
</html>
getElementById方法获取的是一个具体对象,没有length属性,所以输出undefined;
getElementsByTagName返回的是一个元素集合,是一个类数组,拥有length属性;
document.all的用法
用法一
document.all可以判断浏览器是否是IE (IE10及以下版本可以判断,但是 IE11不适用)
if(document.all){
alert("is IE!");
}
用法二
<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>
但是常常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>
理论上一个页面中的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>
对于一个复杂的页面(代码很长,或者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>
var aInp=document.all["inp"];
如果页面中的<input type="checkbox" name="inp" value="aaa"/> 只有一个,那么只返回一个具体元素对象,此时不拥有length属性,如果有多个name=“inp”的input元素,那么返回的是一个元素集合,是一个类数组,拥有length属性;
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>document.all</title>
<script type="text/javascript">
function checkAll(){
var aInp=document.all["inp"];
if(aInp.length){ //如果有多个input
for(i = 0;i < aInp.length;i++){
if(aInp[i].type == "checkbox")
{
aInp[i].checked = true;
}
}
}else{
aInp.checked = true;
}
}
function centerall(){
var aInp=document.all["inp"];
if(aInp.length){
for(i = 0;i < aInp.length;i++){
aInp[i].checked = false;
}
}else{
}
}
</script>
<head>
</head>
<body>
<input type="checkbox" name="inp" value="aaa"/>
<input type="checkbox" name="inp" value="bbb"/>
<input type="checkbox" name="inp" value="ccc"/>
<input type="button" value="checkAll" onClick="checkAll();"/>
<input type="button" value="cancelAll" onClick="centerall();"/>
<div id="wrap"></div>
</html>
JavaScript中document 和document.all对象,可能对于JS新手来说,总是会用错,若知道错了固然很容易改正,问题一般出错的时候我们都不知道是自己用错的对象,而把排错的重点放在其它地方了。为了区别二者的用法,我们先来看一个示例,比较一下哪些时候该用document,哪些时候要用document.all。
<body>
<div id="aa">635896</div>
<input type="button" value="若用document会出错" onclick="alert(document.aa.innerText);" />
<br />
<input type="button" value="用document.all就不会报错" onclick="alert(document.all.aa.innerText);" />
</body>
不知道你是否看懂了?就是说如果与a,form对象,image对象,applet对象相对应的html标记中设定了name属性,那么它的值将被用作document对象的属性名,用来引用相应的对象,其他的对象则不可以。另外,input等如果作为form的子元素,则直接用inputName或者document.inputName来引用此对象就是错误的,必须使用formName.inputName引用。
如果想引用一个有id的元素,只能用Id或者document.getElementById,document.all.id来引用
但是象这样的元素,所以象<a href="......" name="linkname" id="linkid">......</a>这样的,可以用下面的:
linkid.href;
linkname.href;
document.all.linkid.href;
document.all.linkname.href;
document.getElementById("linkid").href;
document.getElementsByName("linkname")[0].href来引用。
<html>
<meta charset="utf-8">
<title>document.all</title>
<script type="text/javascript">
window.onload=function(){
alert(document.getElementById("wrap").length) //undefined
alert(document.getElementsByTagName("input").length); //3
}
</script>
<head>
</head>
<body>
<input type="checkbox" name="inp" value="aaa"/>
<input type="checkbox" name="inp" value="bbb"/>
<input type="checkbox" name="inp" value="ccc"/>
<div id="wrap"></div>
</html>
getElementById方法获取的是一个具体对象,没有length属性,所以输出undefined;
getElementsByTagName返回的是一个元素集合,是一个类数组,拥有length属性;
document.all的用法
用法一
document.all可以判断浏览器是否是IE (IE10及以下版本可以判断,但是 IE11不适用)
if(document.all){
alert("is IE!");
}
用法二
<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>
但是常常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>
理论上一个页面中的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>
对于一个复杂的页面(代码很长,或者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>
var aInp=document.all["inp"];
如果页面中的<input type="checkbox" name="inp" value="aaa"/> 只有一个,那么只返回一个具体元素对象,此时不拥有length属性,如果有多个name=“inp”的input元素,那么返回的是一个元素集合,是一个类数组,拥有length属性;
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>document.all</title>
<script type="text/javascript">
function checkAll(){
var aInp=document.all["inp"];
if(aInp.length){ //如果有多个input
for(i = 0;i < aInp.length;i++){
if(aInp[i].type == "checkbox")
{
aInp[i].checked = true;
}
}
}else{
aInp.checked = true;
}
}
function centerall(){
var aInp=document.all["inp"];
if(aInp.length){
for(i = 0;i < aInp.length;i++){
aInp[i].checked = false;
}
}else{
}
}
</script>
<head>
</head>
<body>
<input type="checkbox" name="inp" value="aaa"/>
<input type="checkbox" name="inp" value="bbb"/>
<input type="checkbox" name="inp" value="ccc"/>
<input type="button" value="checkAll" onClick="checkAll();"/>
<input type="button" value="cancelAll" onClick="centerall();"/>
<div id="wrap"></div>
</html>
JavaScript中document 和document.all对象,可能对于JS新手来说,总是会用错,若知道错了固然很容易改正,问题一般出错的时候我们都不知道是自己用错的对象,而把排错的重点放在其它地方了。为了区别二者的用法,我们先来看一个示例,比较一下哪些时候该用document,哪些时候要用document.all。
<body>
<div id="aa">635896</div>
<input type="button" value="若用document会出错" onclick="alert(document.aa.innerText);" />
<br />
<input type="button" value="用document.all就不会报错" onclick="alert(document.all.aa.innerText);" />
</body>
不知道你是否看懂了?就是说如果与a,form对象,image对象,applet对象相对应的html标记中设定了name属性,那么它的值将被用作document对象的属性名,用来引用相应的对象,其他的对象则不可以。另外,input等如果作为form的子元素,则直接用inputName或者document.inputName来引用此对象就是错误的,必须使用formName.inputName引用。
如果想引用一个有id的元素,只能用Id或者document.getElementById,document.all.id来引用
但是象这样的元素,所以象<a href="......" name="linkname" id="linkid">......</a>这样的,可以用下面的:
linkid.href;
linkname.href;
document.all.linkid.href;
document.all.linkname.href;
document.getElementById("linkid").href;
document.getElementsByName("linkname")[0].href来引用。
相关文章推荐
- dll和so文件区别与构成
- java前台传参json,后台用map或者实体对象接收
- java.lang.RuntimeException: JPedal Trial has now expired
- 网络篇-NSURLConnection进度下载
- 用 ViewPager 实现欢迎引导页面
- [Unity3D]海岛奇兵金币等资源收取效果
- uva 10303 How Many Trees?
- Amazing CSS Animation
- gsm 收发短信 打电话
- shell脚本-获取时间
- 话题: 工人重度烧伤 厂方疑暗示“安乐死”后再赔偿
- t440 安装os 10.11 笔记1(win8 os x 双系统)
- android 5.0上,阴影elevation无效的问题
- ionic学习之建立一个ionic项目
- Noi2002银河英雄传说
- RAC中数据文件创建到了本地路径(非系统表空间)
- Android编译过程详解
- 修改searchbar 取消 字体 颜色
- *Find All Repeating Substring With Given Length
- C函数手册