複製鏈接
請複製以下鏈接發送給好友
https://baike.baidu.hk/item/getElementById/2841233
複製
複製成功

getElementById

鎖定
getElementById，是指根據指定的 id 屬性值得到對象。返回 id 屬性值等於 sID 的第一個對象的引用。假如對應的為一組對象，則返回該組對象中的第一個。
外文名
getElementById
用    途
可返回對擁有指定ID 的引用
含    義
最有效的查找元素的方法
sID
必選項。字符串(String)

目錄

  1. 1 簡介
  2. 2 説明
  3. 3 作用
  4. 4 實例

getElementById簡介

getElementById() 方法可返回對擁有指定 ID 的第一個對象的引用。
HTML DOM 定義了多種查找元素的方法，除了 getElementById() 之外，還有 getElementsByName() 和 getElementsByTagName()。
不過，如果您需要查找文檔中的一個特定的元素，最有效的方法是 getElementById()。
在操作文檔的一個特定的元素時，最好給該元素一個 id 屬性，為它指定一個（在文檔中）唯一的名稱，然後就可以用該 ID 查找想要的元素。 [1] 
語法：
obj= document . getElementById ( sID )
參數：
sID :　必選項。字符串(String)。
返回值：
obj:　對象(object)。

getElementById説明

根據指定的 id 屬性值得到對象。返回 id 屬性值等於 sID 的第一個對象的引用。假如對應的為一組對象，則返回該組對象中的第一個。
如果無符合條件的對象，則返回 null 。
HTML DOM 定義了多種查找元素的方法，除了 getElementById() 之外，還有 getElementsByName() 和 getElementsByTagName()。不過，如果您需要查找文檔中的一個特定的元素，最有效的方法是 getElementById()。在操作文檔的一個特定的元素時，最好給該元素一個 id 屬性，為它指定一個（在文檔中）唯一的名稱，然後就可以用該 ID 查找想要的元素。

getElementById作用

1：做網頁上浮動廣告
<html>
<head>
<title>製作浮動的廣告圖片</title>
<script language="javascript" type="text/javascript">
<!--
var advInitTop=100;//層距離頂端的初始值
function move()
{
window.document.getElementById("advLayer").style.top=advInitTop+window.document.body.scrollTop;
}
window.onscroll=move;//窗口的滾動事件,當頁面滾動時調用move()函數
//-->
</script>
</head>
<body >
<div id="advLayer" style="position:absolute;left:16px;top:129px;width:180px;height:230px; z-index:1;">
<img src="cat.jpg" />
</div>
在這裏加文字用來產生滾動條 img src="cat.jpg" 根據實際情況更改
window.onscroll=move;可去掉 然後 把<body >換成<body onscroll="move()">
注意window.onscroll=move;不能寫為window.onscroll=move（）;
</body>
</html>
2.改變指定元素的值
<html>
<head>
<title>
wangye</title>
<script type="text/javascript">
function changelink(){
x=document.getElementById("myanchor");
x.innerHTML="搜狐";
x.href="#";
}
</script>
</head>
<body>
<a id="myanchor" href="#" >百度</a>
<form name="myform">
<input type="button" value="更換連接" onClick="changelink()" />
</form>
</body>
</html>

getElementById實例

實例1：
<html>
<head>
<script type="text/javascript">
function getValue()
{
var x=document.getElementById("myHeader")
alert(x.innerHTML)
}
</script>
</head>
<body>
<h1 id="myHeader" onclick="getValue()">This is a header</h1>
<p>Click on the header to alert its value</p>
</body>
</html>
實例2：
getElementById() 是一個重要的方法，在 DOM 程序設計中，它的使用非常常見。我們為您定義了一個工具函數，這樣您就可以通過一個較短的名字來使用 getElementById() 方法了：
function id(x) {
if (typeof x == "string") return document.getElementById(x);
return x;
}
上面這個函數接受元素 ID 作為它們的參數。對於每個這樣的參數，您只要在使用前編寫 x = id(x) 就可以了
參考資料