jquery DOM操作基于命令改變頁面

2019-11-21 00:31:30

字體：大中小

供稿：網(wǎng)友

操作屬性
jQuery提供.attr()方法改變屬性值,.removeAttr()方法刪除屬性

 
$(document).ready(function(){ 
$('div.character a').each(function(index){ 
$(this).attr({ 
'rel': 'external', 
'id': 'mylink' + index 
}); 
}); 
}); 

插入新元素
jQuery提供了兩種將元素插入到其它元素前面的方法,.insertBefore()方法和.before()方法,而.insertAfter()和.after()方法則用于將元素插入到其它元素后面.

$(document).ready(function(){
/*
*下面兩種方法效果一樣,使用.insertAfter()方法,可以通過連綴更多方法連續(xù)對所創(chuàng)建的a元素進行操作.
*而使用.after()方法,連綴的其它方法的操作對象會變成$('div.chapter p')中選擇符匹配的元素
*/
$('<a href="#top">back to top</a>').insertAfter('div.chapter p');
$('div.chapter p').after('<a href="#top">back to top</a>');
});

DOM操作方法簡單歸納
(1)要在每個匹配的元素中插入新元素,使用:

.append()
.appendTo()
.prepend()
.prependTo()
(2)要在每個匹配的元素相鄰的位置上插入新元素,使用:

after()
.insertAfter()
.before()
.insertBefore()
(3)要在每個匹配元素的外部插入新元素,使用:

.wrap()
(4)要用新元素或文本替換每個匹配的元素,使用:

.html()
.text()
(5)要移除每個匹配的元素中的元素,使用:

.empty()
(6)要從文檔中移除每個匹配的元素及其后代元素,但不實際刪除它們,使用:

.remove()

上一篇：Jquery 動態(tài)添加按鈕實現(xiàn)代碼

下一篇：JQuery 學習筆記01 JQuery初接觸