jQuery 類與屬性的控制

2018-07-24 11:47 更新
.addClass() .hasClass() .removeClass()
添加一個(gè)類,判斷是否有指定類,刪除類
$('body').addClass('test');
$('body').addClass(function(index, current){return current + 'new'});

$('body').removeClass('test');
$('body').removeClass(function(index, current){return current + ' ' + 'other'});
.toggleClass()
類的開(kāi)關(guān)式轉(zhuǎn)換,它的使用方法有多種:
<img class="test other" />

$('img').toggleClass(); //對(duì)所有類的開(kāi)關(guān)
$('img').toggleClass('test'); //對(duì)指定類的開(kāi)關(guān)
$('img').toggleClass(isTrue); //根據(jù)isTrue判斷所有類的開(kāi)關(guān)
$('img').toggleClass('test', isTrue); //根據(jù)isTrue判斷指定類的開(kāi)關(guān)

//同 $('img').toggleClass('test') 只是類名由函數(shù)返回
$('img').toggleClass(function(index, class, isTrue){return 'name'});

//isTrue會(huì)作為函數(shù)的第三個(gè)參數(shù)傳入
$('img').toggleClass(function(index, class, isTrue){return 'name'}, isTrue);
.attr()
獲取或者設(shè)置一個(gè)屬性值,它的使用方法有多種:
<img id="greatphoto" src="brush-seller.jpg" alt="brush seller" />

$('#greatphoto').attr('alt'); //獲取屬性
$('#greatphoto').attr('alt', 'Beijing Brush Seller'); //設(shè)置屬性

//同時(shí)設(shè)置多個(gè)屬性
$('#greatphoto').attr({
  alt: 'Beijing Brush Seller',
  title: 'photo by Kelly Clark'
});

//設(shè)置屬性為函數(shù)返回值, 函數(shù)的上下文為當(dāng)前元素
$('#greatphoto').attr('title', function(i, val) {
  return val + ' - photo by Kelly Clark';
});
.prop()
用法同 .attr() ,只是對(duì)象變成了 properties
.removeAttr() .removeProp()
刪除屬性
.val()
設(shè)置或獲取元素的表單值,通常用于表單元素。
<input type="hidden" value="test" />

$('input').val();
$('input').val('other');
.html()
設(shè)置或獲取元素的節(jié)點(diǎn)文件本值。
<div><span>測(cè)試</span></div>

$('div').html();
$('div').html('<div>測(cè)試</div>');
$('div').html(function(index, old){return old + '<span>另外的內(nèi)容</span>'});


以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)