Evo. G Tech Team Forum
Welcome to Evo. G Tech Team Forum. We have moved to a new website : www.evogtechteam.com

Thanks you.

by Evo. G Tech Team Management.

getElementById(),getElementsByName(),getElementsByTagName()的差别

View previous topic View next topic Go down

getElementById(),getElementsByName(),getElementsByTagName()的差别

Post by too wei on January 16th 2016, 15:33

DOM 定义了多种查找元素的方法
1.getElementById()
2.getElementsByTagName()
3.getElementsByName()


1.getElementById()     这个是Element,不是Elements,因为ID是唯一的,只能找到一个
-通过ID来查找
比如:
document.getElementById("x");
就会找到
 



2.getElementsByTagName()      这个是Elements,不是Element,因为标签有很多个一样,能找到很多个
-通过标签名tag来查找
-如果document中多个同样标签的,就必须以数组的方式来访问
getElementsByTagName("div")[0]访问第一个DIV
getElementsByTagName("div")[1]访问第二个DIV


3.getElementsByName           这个是Elements,不是Element,因为标签有很多个一样,能找到很多个
-通过name来查找
-不被IE支持,所以尽量避免使用这个
-同样的,必须以数组方式来访问


用getElementsByName("docname")获得这两个DIV
getElementsByName("docname")[0]访问第一个DIV
getElementsByName("docname")[1]访问第二个DIV



这里有个getElementById和getElementsByTagName的例子(没有getElementsByName)

Code:
<!DOCTYPE html>
<html>
<head>
<script>
function searchDOM()
{
 var f_tag = document.getElementsByTagName("ul"); //找出ul标签
 var f_id = document.getElementsById("findmebyid"); //使用id找出
}
</script>
</head>
<body onload = "searchDOM()">

 <div id = "findmebyid"> <!--f_id会找到这里的div!-->
 <p>Digimon World</p>
 </div>

 <ul style = "list-style-type : square"> <!--f_tag会找到这个ul标签!-->
 <li>Agumon</li>
 <li>Greymon</li>
 </ul>
</body>
</html>

too wei
Sponsor
Sponsor

Posts : 31
Points : 17851
Reputation : 0
Join date : 2015-04-21
Age : 19
Location : Johor

View user profile

Back to top Go down

View previous topic View next topic Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum