使用jQuery操作DOM的方法小結(jié)
一.DOM操作分為3類
1.DOM Core
DOM Core不是Javascript的專屬品,任何一種支持DOM的編程語(yǔ)言都可以使用它.它的用途不僅限于處理一種使用標(biāo)記語(yǔ)言編寫(xiě)出來(lái)的文檔
2.HTML-DOM
比DOM Core出現(xiàn)的更早,它提供了一些更加簡(jiǎn)明的標(biāo)記來(lái)描述各種HTML-DOM的元素屬性
3.CSS-DOM
CSS-DOM 失針對(duì)CSS的操作,在JavaScript中,只要作用是獲取和設(shè)置style對(duì)象各種屬性
二.樣式操作
1.直接設(shè)置樣式值
css(name,value) //設(shè)置單個(gè)屬性 css({name:value,name:value,name:value....}) //同事設(shè)置多個(gè)屬性
2.追加樣式和移除樣式
addClass(class) //追加樣式 removeClass(class) //移除樣式
3.切換樣式
taggleClass() //可以切換不同元素的類樣式
三.類容操作
1.html代碼操作
html([content]) //可選,規(guī)定備選元素的新類容,該參數(shù)可以包含HTML標(biāo)簽,無(wú)參數(shù)時(shí),表示被選元素的文本類容
2.標(biāo)簽類容操作
text([content]) //可選,規(guī)定被選元素的新文本類容. 注釋,特殊字符會(huì)被編碼.無(wú)參數(shù)時(shí),表示獲取元素的被選類容
3.屬性值操作
val([value])
四.節(jié)點(diǎn)屬性操作
1.查找節(jié)點(diǎn)
$("xxx")
2.創(chuàng)建節(jié)點(diǎn)
$(selector) //選擇器 $(element) //Dom元素 $(html) //html代碼
3.插入節(jié)點(diǎn)
內(nèi)部插入:append(content) appendTo(content) prepend(content) prependTo(content)
外部插入:after(content) insertAfter(content) before(content) insertBefore(content)
4.刪除節(jié)點(diǎn)
$(selector).remove([expr])
5.替換節(jié)點(diǎn)
$("ul li:eq(1)").replaceWith($xxx)
6.復(fù)制節(jié)點(diǎn)
$(selector).clone([includeEvents])
以上就是本文的全部?jī)?nèi)容,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助,同時(shí)也希望多多支持腳本之家!
- 原生JS和jQuery操作DOM對(duì)比總結(jié)
- 詳解jQuery中的DOM操作
- jQuery利用sort對(duì)DOM元素進(jìn)行排序操作
- jQuery操作dom實(shí)現(xiàn)彈出頁(yè)面遮罩層(web端和移動(dòng)端阻止遮罩層的滑動(dòng))
- 淺談jQuery 選擇器和dom操作
- jQuery遍歷DOM節(jié)點(diǎn)操作之filter()方法詳解
- 牛叉的Jquery——Jquery與DOM對(duì)象的互相轉(zhuǎn)換及DOM的三種操作
- jQuery移動(dòng)和復(fù)制dom節(jié)點(diǎn)實(shí)用DOM操作案例
- jQuery的DOM操作之刪除節(jié)點(diǎn)示例
- jQuery學(xué)習(xí)筆記之jQuery的DOM操作
相關(guān)文章
jQuery+slidereveal實(shí)現(xiàn)的面板滑動(dòng)側(cè)邊展出效果
WEB開(kāi)發(fā)中有時(shí)需要在頁(yè)面上設(shè)置一個(gè)控制面板,默認(rèn)是不顯示的,當(dāng)用戶有需要時(shí)可以通過(guò)按鈕觸發(fā)調(diào)用面板展示。常見(jiàn)的有頁(yè)面?zhèn)冗吇雒姘逍Ч1疚膶⑹褂胘Query插件并結(jié)合實(shí)例給大家介紹一下面板滑動(dòng)展示效果。2015-03-03用Juery網(wǎng)頁(yè)選項(xiàng)卡實(shí)現(xiàn)代碼
現(xiàn)在jquery比較流行,很多的選項(xiàng)卡效果可以通過(guò)jquery來(lái)實(shí)現(xiàn)。2011-06-06輕松學(xué)習(xí)jQuery插件EasyUI EasyUI創(chuàng)建菜單與按鈕
這篇文章主要幫助大家輕松學(xué)習(xí)jQuery插件EasyUI,重點(diǎn)是EasyUI創(chuàng)建菜單與按鈕,按鈕分為鏈接按鈕、菜單按鈕、分割按鈕,對(duì)這方面感興趣的小伙伴們可以參考一下2015-11-11jquery利用event.which方法獲取鍵盤(pán)輸入值的代碼
jquery利用event.which方法獲取鍵盤(pán)輸入值的代碼,需要的朋友可以參考下。2011-10-10jquery.post用法關(guān)于type設(shè)置問(wèn)題補(bǔ)充
當(dāng)使用ajax獲取data數(shù)據(jù)的時(shí)候,直接data.foo就可以得到。而較低版本的jquery就不行比如1.4之前,下面為大家介紹下jquery.post用法關(guān)于type設(shè)置問(wèn)題2014-01-01詳談jQuery.load()和Jsp的include的區(qū)別
下面小編就為大家?guī)?lái)一篇詳談jQuery.load()和Jsp的include的區(qū)別。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-04-04js實(shí)現(xiàn)的黑背景灰色二級(jí)導(dǎo)航菜單效果代碼
這篇文章主要介紹了js實(shí)現(xiàn)的黑背景灰色二級(jí)導(dǎo)航菜單效果代碼,涉及javascript操作頁(yè)面元素動(dòng)態(tài)切換的實(shí)現(xiàn)技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-08-08jquery實(shí)現(xiàn)的鼠標(biāo)拖動(dòng)排序Li或Table
這篇文章主要介紹了使用jquery實(shí)現(xiàn)的鼠標(biāo)拖動(dòng)排序Li或Table,需要的朋友可以參考下2014-05-05使用struts2+Ajax+jquery驗(yàn)證用戶名是否已被注冊(cè)
這篇文章主要介紹了使用struts2+Ajax+jquery驗(yàn)證用戶名是否已被注冊(cè)的相關(guān)資料,需要的朋友可以參考下2016-03-03