HTML DOM屬性
阿新 • • 發佈:2018-12-13
此文章轉載至極客學院
DOM屬性
屬性是節點(HTML 元素)的值,您能夠獲取或設定。
1.程式設計介面
- 可通過 JavaScript (以及其他程式語言)對 HTML DOM 進行訪問。
- 所有 HTML 元素被定義為物件,而程式設計介面則是物件方法和物件屬性。
- 方法是您能夠執行的動作(比如新增或修改元素)。
- 屬性是您能夠獲取或設定的值(比如節點的名稱或內容)。
2.innerHTML 屬性
- 獲取元素內容的最簡單方法是使用 innerHTML 屬性。
- innerHTML 屬性對於獲取或替換 HTML 元素的內容很有用。
例項:
下面的程式碼獲取 id="intro" 的 <p> 元素的 innerHTML:
<html>
<body>
<p id="intro">你好,極客學院!</p>
<script>
var txt=document.getElementById("intro").innerHTML;
document.write(txt);
</script>
</body>
</html>
在上面的例子中,getElementById 是一個方法,而 innerHTML 是屬性。
innerHTML 屬性可用於獲取或改變任意 HTML 元素,包括 <html> 和 <body>。
3.nodeName 屬性
nodeName 屬性規定節點的名稱。
- nodeName 是隻讀的
- 元素節點的 nodeName 與標籤名相同
- 屬性節點的 nodeName 與屬性名相同
- 文字節點的 nodeName 始終是 #text
- 文件節點的 nodeName 始終是 #document
註釋:nodeName 始終包含 HTML 元素的大寫字母標籤名。
4.nodeValue 屬性
nodeValue 屬性規定節點的值。
- 元素節點的 nodeValue 是 undefined 或 null
- 文字節點的 nodeValue 是文字本身
- 屬性節點的 nodeValue 是屬性值
5.獲取元素的值
下面的例子會取回 <p id="intro"> 標籤的文字節點值:
例項:
<html>
<body>
<p id="intro">你好,極客學院!</p>
<script type="text/javascript">
x=document.getElementById("intro");
document.write(x.firstChild.nodeValue);
</script>
</body>
</html>
6.nodeType 屬性
nodeType 屬性返回節點的型別。nodeType 是隻讀的。
比較重要的節點型別有: