[译文]通过ID, TagName, ClassName, Name, CSS selector 得到element

　　致谢原文： <http://xahlee.info/js/js_get_elements.html>

1. 通过ID得到element：

　　　　Document.getElementById(id string) 返回element object, 如果失败，得到null

　　　　注意id在页面内应该是唯一的，但在iframe的看作是另一个html页面

1. 通过TagName得到element

　　　　document.getElementsByTagName(tagname)返回element object集合. tagname 如div, span, p,

　　　　var myList = document.getElementsByTagName("p"); // 得到所有p元素

　　　　myList.length; // 返回p元素总数
　　　　myList[0].style.color = "red"; // 修改第一个元素的style

1. 通过ClassName得到element

　　　　document.getElementsByClassName("class values") 返回element object集合.

　　　　var myList = document.getElementsByClassName("abc");
　　　　myList[0].style.color = "red"; // make the first
one red

　　　　The class values可以是多个，用空格隔开. 比如"aa
bb",

　　　　一个元素也可以有多个ClassName, 比如：
　　　　　　<pclass="aa">1</p>

　　　　　　<pclass="bb">2</p>

　　　　　　<pclass="bb
aa">3</p>

　　　　　　<pclass="bb cc
aa">4</p>

　　　　　　<script>document.getElementsByClassName("aa
bb");</script>

　　　　将会得到第三和第四个元素

1. 通过Name得到element

　　　　document.getElementsByName("name value")  返回element object集合.

　　　　比如：
　　　　　　<pname="abc">you</p>
　　　　　　<divclass="zz"name="xyz">me</div>
　　　　　　<divclass="zz"name="xyz">her</div>

　　　　　　<form>
　　　　　　　　<inputname="xyz"type="text"size="20">
　　　　　　</form>

　　　　　　var xyz =
document.getElementsByName("xyz");
　　　　　　xyz[0].style.color="red"; // make the first
one red

1. 通过CSS Selector得到element

　　　　 document.querySelectorAll(css selector) 返回element object集合,  css selector 是string, 可以是多个用逗号隔开.

　　　　　　var xx = document.querySelectorAll("span.a, span.c");

　　　　　　for (var i = 0; i < xx.length;
i++) {
   　　　　　　 xx[i].style.color="red";
　　　　　　}