> 兴趣爱好
javascipt获取页面元素的方法(js语句如何获取网页元素)
导语：JavaScript-快速获取页面元素 240
通过document的方法快速获取页面元素以便对其进行如显示标签中的文本等操作
1)getElementById()
document.getElementById()根据元素的Id获得指定对象,元素id(自定义)一般都不会重复,非起重复的id名也只会显示获取第一个有此id的元素
<div id=&34;>获取dv1</div> <div id=&34;>获取dv2</div> <script type=&34;> var d = document.getElementById(&39;);//获取指定的dv1 alert(d.innerHTML);//显示div中的文字 </script>2)getElementsByName()
document.getElementsByName()根据元素的name获得对象,元素中的name可以重复比如多个RadioButton的name一样,因此getElementsByName返回值是对象数组
<input type=&34; name=&34; value=&34; />男 <input type=&34; name=&34; value=&34; />女 <script type=&34;> var rds = document.getElementsByName(&39;); for (var i = 0; i < rds.length; i++) { alert(rds[i].value); } </script>3)getElementsByClassName
document.getElementsByClassName()获取所有指定类名的元素数组
<head> <meta http-equiv=&34; content=&34; /> <title>获取页面元素</title> <style type=&34;> .c1 { width: auto; height: 50px; border: 1px solid red; } .c2 { width: auto; height: 50px; border: 1px solid blue; } </style></head> <div class=&34;>dv1</div> <div class=&34;>dv2</div> <div class=&34;>dv3</div> <div class=&34;>dv4</div> <script type=&34;> var dvs = document.getElementsByClassName(&39;);//获取指定类名的元素 for (var i = 0; i < dvs.length; i++) { alert(dvs[i].innerHTML);//显示div标签中的文字 } </script>4)getElementsByTagName()
document.getElementsByTagName()获得指定标签的元素数组
<div id=&34;>dv1</div> <div id=&34;>dv2</div> <p>p1</p> <p>p2</p> <p>p3</p> <script type=&34;> var ps = document.getElementsByTagName(&39;);//获取指定的p标签 for (var i = 0; i < ps.length; i++) { alert(ps[i].innerHTML);//显示p标签中的文字 } </script>注意:如果脚本书写在head标签中时,需要将获取元素的代码放在window.onload事件中
本文内容由小思整理编辑！