在javascript中,操作HTML DOM時,需要經常用到getElementById 與 getElementsByTagName兩個函數,下面記錄一下這兩個函數的具體區別所在:
getElementById(idName)函數:
根據提供的idName獲取頁面中的對象。得到的結果是單一的對象。比如:
document.getElementById('left') ----- 獲取ID爲left的對象【記住:每個id在頁面中都是唯一的】
getElementsByTagName(tagName)函數:
根據提供的tagName獲取頁面中的指定標記的對象,得到的結果是一個數組。比如以下代碼:
var p = document.getElementsByTagName("p"); //獲取所有的<p>...</p>
var first_p = p[0]; //這是第一個段落
first_p.parentNode.removeChild[first_p]; // 刪除這個段落
最後附上一個實例:
<html>
<head>
<title>HTML DOM實例演示</title>
<script type="text/javascript">
function delete_firstP()
{
var p = document.getElementsByTagName("p")[0];
p.parentNode.removeChild(p);
}
function delete_h1()
{
var h1 = document.getElementById("dv").getElementsByTagName("h1")[0];
h1.parentNode.removeChild(h1);
}
</script>
</head>
<body>
<p>hello,world!</p>
<div id="dv">
<h1>hello,world!</h1>
<h2>hello,world!</h2>
<h3>hello,world!</h3>
</div>
<div>
<input type="button" value="刪除h1" onclick="delete_h1()" />
<input type="button" value="刪除第一段" onclick="delete_firstP();" />
</div>
</body>
</html>