Query 擁有可操作 HTML 元素和屬性的強大方法。

jQuery DOM 操作

jQuery 中非常重要的部分，就是操作 DOM 的能力。

jQuery 提供一系列與 DOM 相關的方法，這使訪問和操作元素和屬性變得很容易。

	DOM = Document Object Model（文件物件模型）   DOM 定義訪問 HTML 和 XML 文件的標準： "W3C 文件物件模型獨立於平臺和語言的介面，允許程式和指令碼動態訪問和更新文件的內容、結構以及樣式。"

獲得內容 - text()、html() 以及 val()

三個簡單實用的用於 DOM 操作的 jQuery 方法：

• text() - 設定或返回所選元素的文字內容
• html() - 設定或返回所選元素的內容（包括 HTML 標記）
• val() - 設定或返回表單欄位的值

獲取屬性 - attr()

jQuery attr() 方法用於獲取屬性值。

下面的例子演示如何獲得連結中 href 屬性的值：

例項

$("button").click(function(){ alert($("#runoob").attr("href")); });

1. attr 和 prop 的區別介紹：

   對於 HTML 元素本身就帶有的固有屬性，在處理時，使用 prop 方法。

   對於 HTML 元素我們自己自定義的 DOM 屬性，在處理時，使用 attr

    方法。

   例項 1：

   <a href="https://www.runoob.com" target="_self" class="btn">菜鳥教程</a>

   這個例子裡 <a> 元素的 DOM 屬性有: href、target 和 class，這些屬性就是 <a> 元素本身就帶有的屬性，也是 W3C 標準裡就包含有這幾個屬性，或者說在 IDE 裡能夠智慧提示出的屬性，這些就叫做固有屬性。處理這些屬性時，建議使用 prop 方法。

   <a href="#" id="link1" action="delete" rel="nofollow">刪除</a>

   這個例子裡 <a> 元素的 DOM 屬性有: href、id 和 action，很明顯，前兩個是固有屬性，而後面一個 action 屬性是我們自己自定義上去的，<a> 元素本身是沒有這個屬性的。這種就是自定義的 DOM 屬性。處理這些屬性時，建議使用 attr 方法。

2. prop()函式的結果:

         1.如果有相應的屬性，返回指定屬性值。

         2.如果沒有相應的屬性，返回值是空字串。

   attr()函式的結果:

         1.如果有相應的屬性，返回指定屬性值。

         2.如果沒有相應的屬性，返回值是undefined。

   對於HTML元素本身就帶有的固有屬性，在處理時，使用prop方法。

   對於HTML元素我們自己自定義的DOM屬性，在處理時，使用attr方法。

   具有 true 和 false 兩個屬性的屬性，如 checked, selected 或者 disabled 使用prop()