一.節點操作

1.DOM內容節點操作：

? ①innerHTML屬性：設置或獲取文本的內容（普通文本和標簽）。

? ②innerText屬性：設置或獲取文本的內容（普通文本），存在兼容性問題。

2.jQuery內容節點屬性：

? ①html([value])方法：設置或獲取文本內容（普通文本和標簽）。

? ②text([value])方法：設置或獲取文本的內容（普通文本），不存在兼容性問題。

二.jQuery屬性操作

1.DOM的value屬性

? value屬性：設置或獲取表單元素（表單域和表單按鈕）的默認值。

2.jQuery的val([value])方法

? val([value])方法設置或獲取表單元素（表單域和表單按鈕）的默認值。

? 注：DOM中常用屬性值來操作，而jQuery常用方法來操作。

3.DOM屬性節點操作和jQuery屬性節點操作的區別

1）DOM屬性節點操作

? ①把元素節點當做普通js對象來操作屬性（點語法和中括號法）

? 缺點：無法操作class屬性

? ②使用DOM提供的方法來操作

? getAttribute("屬性名")

? setAttribute("屬性名"，"屬性值")

? hasAttribute("屬性名")

? removeAttribute("屬性名")

? ③使用className來操作

? 注：采用的是覆蓋操作

2）jQuery屬性節點操作

? ①采用attr()方法來操作屬性

? 注：可以操作固有屬性，也可以操作自定義屬性。

? a.獲取屬性

? 語法：attr("屬性名")

? b.設置單個屬性

? 語法：attr("屬性名"，"屬性值")；

? c.設置多個屬性

? 語法：attr({

? "屬性名1"："屬性值1"，

? "屬性名2"："屬性值2"，

? ...

? });

? d.刪除屬性

? 語法：removeAttr("屬性名")

? ②采用prop（）方法來操作屬性

? 注：主要用于操作固有屬性，操作checked、selected和disabled屬性，一定要有

? prop（）方法，不能用attr（）方法。

? a.獲取屬性

? 語法：prop("屬性名")

? 作用：當屬性名為：checked、selected時，如果選中狀態時則返回true，則否

? 返回false，當屬性名為：disabled時，當禁用狀態時返回true，否則返回false

? b.設置屬性

? 語法：prop（"屬性名"，"屬性值"）

? 作用：當屬性名為：checked、selected時，設置的屬性值如果為true，代表選

? 中，否則代表沒選中；當屬性值為disable時，設置的屬性值如果為true，代表

? 禁用否則代表取消禁用。

? 注：如果屬性值為boolean類型，那么可以不用雙引號或單引號包裹。

? c.刪除屬性

? 語法：removeProp("屬性名")

? 注：使用DOM或jQuery提供的方法來操作表單屬性，操作完畢之后在標簽上面

? 不會有任何展示，使用DOM或jQuery所做的任何操作，都是在內存中做的操作。

? ③專門為class屬性提供的操作方法

? a.添加class屬性

? 語法：addClass("class屬性值")；

? 注：jQuery提供添加class的方法做的是追加操作。

? b.判斷是否存在某個class屬性值（返回的是Boolean類型值）

? 語法：hasClass("class屬性值")；

? c.刪除class屬性

? 語法：removeClass(["class屬性值"])；

? 注：如果沒有參數，則代表刪除所有的class屬性值，

? 如果有參數，代表刪除指定的class屬性值

? d.切換class屬性

? 語法：toggleClass("class屬性值");

? 注：如果標簽中對應的“class屬性值”存在，則刪除

? 如果標簽中對應的“class屬性值”不存在，則添加

總結

以上是生活随笔為你收集整理的js给标签添加属性和值_jquery节点属性的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。