JavaScript 是一種強大的腳本語言，可以幫助我們輕松地操作 DOM 元素。在頁面中，我們經常需要獲取 DOM 元素的屬性值，例如節點的 class、id、title 等。本文將介紹如何使用 JavaScript 獲取 DOM 節點屬性值，并為您提供一些示例。
## 獲取 DOM 節點屬性的方式
-getAttribute()方法：獲取元素的指定屬性值。返回的是一個字符串。 - 直接訪問屬性：將節點屬性作為對象的屬性名訪問，并獲取該屬性的值。如果屬性不存在，則返回undefined。 - 使用專用屬性：對于某些常見的屬性，存在著對應的屬性和方法以及值，例如el.id，el.class，el.href，el.innerHTML等。
下面，我們將通過實例來演示如何使用這些方法來獲取 DOM 節點屬性值。
### 使用 getAttribute() 方法獲取屬性值

<p id="para1">這是一個段落。</p>
<br>
<script>
var para = document.getElementById("para1");
var id = para.getAttribute("id");
document.write(id);
</script>
<br>

輸出結果為：

para1

如上代碼所示，我們通過document.getElementById()方法獲取 id 為 "para1" 的節點，然后通過getAttribute("id")方法獲取該節點的 id 屬性 并輸出結果。
### 直接訪問節點屬性

<p id="para2" class="intro">這是一個段落。</p>
<br>
<script>
var para = document.getElementById("para2");
var id = para.id;
var className = para.className;
document.write(id);
document.write(className);
</script>

輸出結果為：

para2 intro

如上代碼所示，我們通過document.getElementById()方法獲取 id 為 "para2" 的節點，然后直接訪問該節點的 id 和 class 屬性，最后輸出結果。
### 使用專用屬性獲取屬性值
在很多情況下，DOM 節點的某些屬性都有已知的屬性名。例如，訪問元素的 id 屬性可以使用el.id。下面是一些示例：

<p id="para3" class="intro">這是一個段落。</p>
<br>
<script>
var para = document.getElementById("para3");
<br>
document.write("id：" + para.id + "<br>");
document.write("class：" + para.className + "<br>");
document.write("href：" + document.getElementById("myLink").href);
</script>
<br>
<a  id="myLink">點擊這里</a>

輸出結果為：

id：para3
class：intro
href：https://www.baidu.com/

如上代碼所示，我們使用了專用屬性id，className和href來獲取相應的屬性值，并同時打印出它們的值。
## 總結
我們在使用 JavaScript 操作 DOM 元素時，經常需要獲取節點的屬性值，例如 id、class、href、title 等等。獲取屬性值的方式有多種，包括getAttribute()方法、直接訪問屬性和使用專用屬性。要根據需求選擇不同的方法來獲取相應的屬性值。