使用document.all.item定位Html元素

关注

转载最新推荐文章于 2025-07-05 08:23:46 发布 354 阅读 AI 写同款· GEO 优化 ›

定位Html文档元素的最简单的方法之一就是使用document对象（由window.document 属性代表）的all集合，它包含了Html页面中所有的元素。又因为每个元素由其id或name属性所代表，故可以方便的通过all集合数组或元素的id或name属性定位（或访问）特定的Html元素。需要注意的是：部分Html元素只有id属性而无name属性，如<HTML>,<BODY>,<SPAN>，<DIV>等；而asp.net的WEB控件也更多的使用id属性来访问控件，故建议只使用id属性来定位（或访问）特定的Html元素。
1) 定位的方法：
document.all[index]
document.all[“id“]
document.all.item(index)
document.all.item(“id“)
document.all[“name“]
document.all.item(“index“)
注:在IE浏览器及Jscript中，也可以：document.all(index) document.all(“id“) document.all(“name“) ,但为了统一和不混淆，建议不这样使用。
2）当存在多个元素的id或name属性值相同的情况时，你按1）中相应方法得到的将是这些元素的集合。这时你就可以考虑这样访问(这里使用1）中的document.all.item(“id“))：
document.all.item(“id“).item( index' )
document.all.item(“id“,index' )
document.all.item(“id“)( index' )
3）可以使用all.tags来返回属于指定Html标记类型的所有元素对象的集合：
document.all.tags(“Html标记“)

<body>

<b>Child <u>Grandchild</u></b>

<v:myTag>Custom Tag</v:myTag>

</div>

var bTags, uTags, mTags;

bTags = Foo.all.tags("B");

uTags = Foo.all.tags("U");

mTags = Foo.all.tags("myTag");

alert(bTags.length);

alert(uTags.length);

alert(mTags.length);

</script>

</body>

</html>

4）对于文档中的与<BODY>“视觉上同层”（编辑代码时看起来处于同一层次，实际上<BODY>是<HTML>的子元素等）的元素如<HTML><SCRIPT>，以及<BODY>的直接子元素而言，可以简便的使用window来访问：
window.id

window.name

1、document.all.myCheckBox和 document.all.item通过控件的名字定位控件，item()中是控件的名字
例如：
<input type="checkbox" name="myCheckBox">
可以用
document.all.myCheckBox得到这个控件，也可以写成document.all.item("myCheckBox")
用item的好处是，
1.如果你的控件的name是数字，比如<br>
<input type="checkbox" name="123456789">
，使用document.all.123456789会报错，用document.all.item("123456789")可以正确得到。
2.如果你的控件名字存在一个变量中，你必须这样写
var name = "myCheckBox";
eval("document.all."+name);
同样也可以写成document.all.item(name)
<form name="form1">
<input id="a" name="a" type="text" value="123123213">
</form>
<script language="javascript">
document.write(document.form1.a.value);
document.write("<br>");
document.write(document.all.item("a").value);
</script>

2、一个form同时提交到两个页面的效果，工作的需要，随手记了下来！
<script language="javascript">
function F_submit(){
document.form1.target="_blank";
document.form1.action="1.asp";
document.form1.submit();
document.form1.target="_blank";
document.form1.action="2.asp";
document.form1.submit();
}
</script>
<form name="form1" method="post" action="">
<input type="text" name="textfield">
<input type="button" name="Submit" value="提交" onClick="F_submit()">
</form>