快捷導(dǎo)航

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

更新時(shí)間：2019年05月23日 15:19:06 作者：行走的陽(yáng)光

這篇文章主要介紹了jQuery操作attr、prop、val()/text()/html()、class屬性，本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下

1.1 arr操作

設(shè)置單個(gè)屬性

// 第一個(gè)參數(shù)：需要設(shè)置的屬性名
// 第二個(gè)參數(shù)：對(duì)應(yīng)的屬性值
// $obj.attr(name, value);
// 用法舉例、
$('img').attr('alt','不錯(cuò)哦');

獲取屬性

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

移除屬性

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

2.prop操作

在jQuery1.6之后支持，對(duì)于checked、selected、disabled這類boolean類型的屬性來(lái)說(shuō)，不能用attr方法，只能用prop方法。

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

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

$obj.val()    獲取或者設(shè)置表單元素的value屬性的值
$obj.html()   對(duì)應(yīng)innerHTML
$obj.text()    對(duì)應(yīng)innerText

以上三個(gè)方法：不傳參數(shù) 表示獲取值；傳遞一個(gè)參數(shù)值，表示設(shè)置

4.class操作

添加樣式類

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

移除樣式類

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

判斷是否有某個(gè)樣式類

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

切換樣式類

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

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

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

2.獲取操作的時(shí)候，如果是多個(gè)元素，那么只會(huì)返回第一個(gè)元素的值。

3.如果想要獲取多個(gè)值，需要手動(dòng)進(jìn)行遍歷操作

總結(jié)

以上所述是小編給大家介紹的jQuery操作attr、prop、val()/text()/html()、class屬性，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)歡迎給我留言，小編會(huì)及時(shí)回復(fù)大家的！

您可能感興趣的文章:

欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片