jQuery是一種JavaScript庫,它提供了許多簡(jiǎn)化DOM操作的方法。DOM屬性值是我們可以通過jQuery訪問的一些屬性值,例如class、id或value等。 我們可以使用.attr()方法來獲取或設(shè)置DOM元素的屬性值。例如,使用以下代碼獲取一個(gè)input元素的表單值:
var inputValue = $('input').attr('value');
類似地,我們可以設(shè)置屬性值,例如以下代碼將class屬性值設(shè)置為“active”:$('div').attr('class', 'active');
如果要一次設(shè)置多個(gè)屬性值,可以傳遞一個(gè)對(duì)象作為參數(shù),如下所示:$('input').attr({
'class': 'form-control',
'id': 'username'
});
我們還可以使用.prop()方法來獲取或設(shè)置DOM元素的屬性值。這個(gè)方法主要用于特定屬性的布爾值(例如checked、disabled等)。例如,以下代碼獲取一個(gè)復(fù)選框的checked屬性值:var isChecked = $('input[type=checkbox]').prop('checked');
類似地,我們可以設(shè)置這些屬性值,例如以下代碼將checked屬性值設(shè)置為true:$('input[type=checkbox]').prop('checked', true);
無論使用.attr()還是.prop(),我們都可以提供一個(gè)函數(shù)作為值來動(dòng)態(tài)設(shè)置這些屬性值。這使得我們可以根據(jù)其他條件計(jì)算屬性值。例如,以下代碼給所有鏈接添加一個(gè)target屬性,該屬性基于鏈接的相對(duì)路徑是否與當(dāng)前頁面相同:$('a').attr('target', function() {
return this.host == location.host ? '_self' : '_blank';
});
這里的函數(shù)接受當(dāng)前元素的索引作為參數(shù),并返回要設(shè)置的屬性值。
總之,使用jQuery的.attr()和.prop()方法,我們可以輕松地獲取和設(shè)置DOM元素的屬性值,這可以使我們的JavaScript代碼更加簡(jiǎn)潔和易于維護(hù)。