jQuery的属性操作
jquery的屬性操作模塊分為四個(gè)部分：html屬性操作，dom屬性操作，類樣式操作和值操作
- html屬性操作：是對(duì)html文檔中的屬性進(jìn)行讀取，設(shè)置和移除操作。比如attr()、removeAttr()
- DOM屬性操作：對(duì)DOM元素的屬性進(jìn)行讀取，設(shè)置和移除操作。比如prop()、removeProp()
- 類樣式操作：是指對(duì)DOM屬性className進(jìn)行添加，移除操作。比如addClass()、removeClass()、toggleClass()
- 值操作：是對(duì)DOM屬性value進(jìn)行讀取和設(shè)置操作。比如html()、text()、val()
?
attr()
設(shè)置屬性值或者 返回被選元素的屬性值
//獲取值：attr()設(shè)置一個(gè)屬性值的時(shí)候 只是獲取值var id = $('div').attr('id')console.log(id)var cla = $('div').attr('class')console.log(cla)//設(shè)置值//1.設(shè)置一個(gè)值 設(shè)置div的class為box$('div').attr('class','box')//2.設(shè)置多個(gè)值，參數(shù)為對(duì)象，鍵值對(duì)存儲(chǔ)$('div').attr({name:'hahaha',class:'happy'})?
attr刪除屬性前面必須加上你要?jiǎng)h除的屬性的值： 如果里面的括號(hào)寫一個(gè)選項(xiàng)就是獲取一個(gè)值 如果是兩個(gè)選項(xiàng)就是增加 即覆蓋，它增加的值就是覆蓋了以前的值
$('要?jiǎng)h除的選項(xiàng)').attr('要?jiǎng)h除的選項(xiàng)', '具體的值');
removeAttr()
移除屬性
//刪除單個(gè)屬性 $('#box').removeAttr('name'); $('#box').removeAttr('class');//刪除多個(gè)屬性 $('#box').removeAttr('name class');removeAttr是刪除 你的屬性（‘要?jiǎng)h除的class/id’,'具體的值'）
prop()
prop() 方法設(shè)置或返回被選元素的屬性和值。
當(dāng)該方法用于返回屬性值時(shí)，則返回第一個(gè)匹配元素的值。
當(dāng)該方法用于設(shè)置屬性值時(shí)，則為匹配元素集合設(shè)置一個(gè)或多個(gè)屬性/值對(duì)。
語(yǔ)法：
返回屬性的值：
$(selector).prop(property)設(shè)置屬性和值：
$(selector).prop(property,value)設(shè)置多個(gè)屬性和值：
$(selector).prop({property:value, property:value,...})關(guān)于attr()和prop()的區(qū)別
prop是可以檢測(cè)它的本身的固有屬性就是style 它喝attr相比? 比attr多了可以判斷正確的方法，所以一般只有判判true和false的時(shí)候才會(huì)用到prop
?
?
什么時(shí)候使用attr()，什么時(shí)候使用prop()？
1.是有true,false兩個(gè)屬性使用prop();
2.其他則使用attr();
?
addClass（添加多個(gè)類名）
為每個(gè)匹配的元素添加指定的類名。
$('div').addClass("box");//追加一個(gè)類名到原有的類名還可以為匹配的元素添加多個(gè)類名
$('div').addClass("box box2");//追加多個(gè)類名removeClass
從所有匹配的元素中刪除全部或者指定的類。
?移除指定的類（一個(gè)或多個(gè)）
$('div').removeClass('box')；移除全部的類
$('div').removeClass();可以通過(guò)添加刪除類名，來(lái)實(shí)現(xiàn)元素的顯示隱藏
代碼如下：
var tag = false;$('span').click(function(){if(tag){$('span').removeClass('active')tag=false;}else{$('span').addClass('active')tag=true;} })案例：
代碼如下：
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title></title><style type="text/css">.active{color: red;}</style> </head> <body><ul><li class="item">張三</li><li class="item">李四</li><li class="item">王五</li></ul><script type="text/javascript" src="jquery-3.3.1.js"></script><script type="text/javascript">$(function(){$('ul li').click(function(){// this指的是當(dāng)前點(diǎn)擊的DOM對(duì)象 ,使用$(this)轉(zhuǎn)化jquery對(duì)象$(this).addClass('active').siblings('li').removeClass('active');})})</script></body> </html>?
toggleClass
如果存在（不存在）就刪除（添加）一個(gè)類。
語(yǔ)法：toggleClass('box')
?
$('span').click(function(){//動(dòng)態(tài)的切換class類名為active$(this).toggleClass('active') })html
獲取值：
語(yǔ)法;
html() 是獲取選中標(biāo)簽元素中所有的內(nèi)容
$('#box').html();設(shè)置值：設(shè)置該元素的所有內(nèi)容 會(huì)替換掉 標(biāo)簽中原來(lái)的內(nèi)容
$('#box').html('<a href="https://www.baidu.com">百度一下</a>');?
?
text
獲取值：
text() 獲取匹配元素包含的文本內(nèi)容
語(yǔ)法：
$('#box').text();設(shè)置值：
設(shè)置該所有的文本內(nèi)容
注意：值為標(biāo)簽的時(shí)候 不會(huì)被渲染為標(biāo)簽元素 只會(huì)被當(dāng)做值渲染到瀏覽器中
?
?
val
獲取值：
val()用于表單控件中獲取值，比如input textarea select等等
設(shè)置值：
?
$('input').val('設(shè)置了表單控件中的值')；?
轉(zhuǎn)載于:https://www.cnblogs.com/zhaoyunlong/p/9122767.html
總結(jié)
以上是生活随笔為你收集整理的jQuery的属性操作的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： 3ds max 2012 插件think
- 下一篇： 第10章 springboot是什么