jQuery如何操作attr、prop、val()/text()/html()、class屬性

這篇文章主要介紹了jQuery如何操作attr、prop、val()/text()/html()、class屬性，具有一定借鑒價值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

1.1 arr操作

  設置單個屬性

// 第一個參數：需要設置的屬性名
// 第二個參數：對應的屬性值
// $obj.attr(name, value);
// 用法舉例、
$('img').attr('alt','不錯哦');

  獲取屬性

// 傳需要獲取的屬性名稱，返回對應的屬性值
// $obj.attr(name)
// 用法舉例
var oTitle = $('img').attr('title');
alert(oTitle);

  移除屬性

// 參數：需要移除的屬性名，
// $obj.removeAttr(name);
// 用法舉例
$('img').removeAttr('title');

2.prop操作

    在jQuery1.6之后支持，對于checked、selected、disabled這類boolean類型的屬性來說，不能用attr方法，只能用prop方法。

// 設置屬性
$(':checked').prop('checked',true);
// 獲取屬性
$(':checked').prop('checked');// 返回true或者false

3.val()/text()/html()值操作

$obj.val()    獲取或者設置表單元素的value屬性的值
$obj.html()   對應innerHTML
$obj.text()    對應innerText

以上三個方法：不傳參數 表示獲取值； 傳遞一個參數值，表示設置

4.class操作

    添加樣式類

// name：需要添加的樣式類名，注意參數不要帶點.
// $obj.addClass(name);
// 例子,給所有的div添加one的樣式。
$('div').addClass('one');

    移除樣式類

// name:需要移除的樣式類名
// $obj.removeClass('name');
// 例子，移除div中one的樣式類名
$('div').removeClass('one');

    判斷是否有某個樣式類

// name:用于判斷的樣式類名，返回值為true false
// $obj.hasClass(name)
// 例子，判斷第一個div是否有one的樣式類
$('div').hasClass('one');

    切換樣式類

// name:需要切換的樣式類名，如果有，移除該樣式，如果沒有，添加該樣式。
// $obj.toggleClass(name);
// 例子
$('div').toggleClass('one');

5.隱式迭代(批量操作自動遍歷)

    1.設置操作的時候（綁定事件），如果是多個元素，那么給所有的元素設置相同的值。

    2.獲取操作的時候，如果是多個元素，那么只會返回第一個元素的值。

    3.如果想要獲取多個值，需要手動進行遍歷操作 

感謝你能夠認真閱讀完這篇文章，希望小編分享的“jQuery如何操作attr、prop、val()/text()/html()、class屬性”這篇文章對大家有幫助，同時也希望大家多多支持億速云，關注億速云行業資訊頻道，更多相關知識等著你來學習!