|
WEB標(biāo)準(zhǔn)下可以通過getElementById(), getElementsByName(), and getElementsByTagName()訪問DOCUMENT中的任一個(gè)標(biāo)簽。
（1）getElementById()：
getElementById()可以訪問DOCUMENT中的某一特定元素，顧名思義，就是通過ID來取得元素，所以只能訪問設(shè)置了ID的元素。
（2）getElementsByName()：
該方法是通過NAME屬性來獲得元素，但注意區(qū)別：getElementById()中是element,而getElementsByName()是elements。顯而易見，getElementsByName()返回值有很多，這是因?yàn)镈OCUMENT中每一個(gè)元素的ID是唯一的，但NAME卻可以重復(fù)。如果一個(gè)文檔中有兩個(gè)以上的標(biāo)簽NAME相同，那么getElementsByName()就可以取得這些元素組成一個(gè)數(shù)組。
例如：
<div name="docname" id="docid1"></div>
<div name="docname" id="docid2"></div>
那么可以用getElementsByName("docname")獲得這兩個(gè)DIV元素，用getElementsByName("docname")[0]訪問第一個(gè)DIV，用getElementsByName("docname")[1]訪問第二個(gè)DIV。
（3）getElementsByTagName()
getElementsByTagName()是通過TAGNAME（標(biāo)簽名稱）來獲得元素，一個(gè)DOCUMENT中當(dāng)然會(huì)有相同的標(biāo)簽，所以這個(gè)方法也是取得一個(gè)數(shù)組。
例如：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www./TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www./1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>Byname,tag</title>
<style type="text/css">
<!--
#docid1,#docid2{
margin:10px;
height:400px;
width:400px;
background-color:#999;}
-->
</style>
</head>
<body>
<div name="docname" id="docid1" onClick="bgcolor()"></div>
<div name="docname" id="docid2" onClick="bgcolor()"></div>
</body>
</html>
<script language="JavaScript" type="text/JavaScript">
<!--
function bgcolor(){
var docnObj=document.getElementsByTagName("div");
docnObj[0].style.backgroundColor = "black";
docnObj[1].style.backgroundColor = "black";
}
-->
</script>
總結(jié)一下標(biāo)準(zhǔn)DOM，訪問某一特定元素盡量用標(biāo)準(zhǔn)的getElementById()，訪問標(biāo)簽用標(biāo)準(zhǔn)的getElementByTagName(),但I(xiàn)E不支持getElementsByName()，所以就要避免使用getElementsByName()，但getElementsByName()和不符合標(biāo)準(zhǔn)的document.all[]也不是全無是處，它們有自己的方便之處，用不用那就看網(wǎng)站的用戶使用什么瀏覽器，由你自己決定了。
Javascript中的getElementById十分常用，但在標(biāo)準(zhǔn)的頁面中，一個(gè)id只能出現(xiàn)一次，如果我想同時(shí)控制多個(gè)元素，例如點(diǎn)一個(gè)鏈接， 讓多個(gè)層隱藏，該怎么做？用class，當(dāng)然，同一個(gè)class是可以允許在頁面中重復(fù)出現(xiàn)的，那么有沒有g(shù)etElementByClass呢？沒有， 但是可以解決：
//Create an array
var allPageTags = new Array();
function hideDivWithClasses(theClass) {
//Populate the array with all the page tags
var allPageTags=document.getElementsByTagName("div");
//Cycle through the tags using a for loop
for (i=0; i<allPageTags.length;i++)
{
if (allPageTags[i].className==theClass) {
//Manipulate this in whatever way you want
allPageTags[i].style.display='none';
}
}
}
鑒于getElementById()方法使用比較頻繁，我在網(wǎng)上搜集了一下關(guān)于此方法的一些用法。
document.getElementById("link").href;
document.getElementById("link").target;
document.getElementById("img").src;
document.getElementById("img").width;
document.getElementById("img").height;
document.getElementById("input").value;
那么如何取得<div></div>以及<a></a>之間的值呢？如<div id="div">aaa</div>中的aaa，<a href="#" id="link">bbb</a>中的bbb，也很簡(jiǎn)單，利用innerHTML就可以了：
document.getElementById("div").innerHTML;
document.getElementById("link").innerHTML;
getElementById 方法
返回具有指定 ID 屬性值的第一個(gè)對(duì)象的一個(gè)引用。
語法
oElement = document.getElementById(sIDValue)
參數(shù)
sIDValue 必選項(xiàng)。指明 ID 屬性值的字符串
返回值
返回 ID 屬性值與指定值相同的第一個(gè)對(duì)象。 //返回值是一個(gè)對(duì)象
注釋
如果 ID 屬于一個(gè)集合，getElementById 方法返回集合中的第一個(gè)對(duì)象。
getElementById 方法與使用 all 集合上的 item 方法等同。例如，以下代碼樣本表示如何從 document 對(duì)象中取回 ID 為 oDiv 的第一個(gè)要素。
使用 DHTML 對(duì)象模型：
var oVDiv = document.body.all.item("oDiv");
使用文檔對(duì)象模型(DOM)：
var oVDiv = document.getElementById("oDiv");
示例
以下例子表示如何使用 getElementById 方法返回 ID 屬性值 oDiv 的第一次出現(xiàn)。
<script>
function fnGetId(){
// Returns the first DIV element in the collection.
var oVDiv=document.getElementById("oDiv1");
}
</script>
<DIV ID="oDiv1">Div #1</DIV>
<DIV ID="oDiv2">Div #2</DIV>
<DIV ID="oDiv3">Div #3</DIV>
<INPUT TYPE="button" VALUE="Get Names" onclick="fnGetId()">
getElementById 方法
返回具有指定 ID 屬性值的第一個(gè)比如說有個(gè)網(wǎng)頁中有個(gè)text框的id叫text1
getElementById(text1)就能得到這個(gè)text1框的對(duì)象,并使用text框的所有屬性和方法
這個(gè)是JS的一個(gè)方法，意思是通過控件ID取得元素的值，如一個(gè)form里包函text、label等，他們都是FORM的元素，有一個(gè)分配的ID，getElementById()是取得這些元素的text值的。
|
