jquery之dom學習

jquery对dom的操作是很重要的，在网站中需要用到jquery的地方最多的也就是对dom的操作了，所以学好jquery对dom的操作是多么重要的事。

append()：向每个匹配的元素内部追加内容
prepend()：向每个匹配的元素内部前置内容
appendTo()：把所有匹配的元素追加到另一个指定元素的集合中
prependTo()：把所有匹配的元素前置到另一个指定的元素集合中

.after(content) ：在匹配元素集合中的每个元素后面插入参数所指定的内容,作为其兄弟节点
.before(content)： 在匹配元素前面插入指定内容
insertAfter()：将JQuery封装好的元素插入到指定元素的后面，如果元素后面有元素了，那将后面的元素后移，然后将JQuery对象插入；
insertBefore()：将JQuery封装好的元素插入到指定元素的前面，如果元素前面有元素了，那将前面的元素前移，然后将JQuery对象插入；

empty() ：顾名思义，清空方法，但是与删除又有点不一样，因为它只移除了 指定元素中的所有子节点。
remove() ：remove会将元素自身移除，同时也会移除元素内部的一切，包括绑定的事件及与该元素相关的jQuery数据。
detach()：通过detach方法删除元素,只是页面不可见，但是这个节点还是保存在内存中,数据与事件都不会丢失
.clone()方法：深度 复制所有匹配的元素集合，包括所有匹配元素、匹配元素的下级元素、文字节点。
//clone处理一
$("div").clone()   //只克隆了结构，事件丢失
//clone处理二
$("div").clone(true) //结构、事件与数据都克隆

.replaceWith( newContent )：用提供的内容替换集合中所有匹配的元素并且返回被删除元素的集合
.replaceAll( target )：用集合的匹配元素替换每个目标元素
.wrap(wrappingElement)： 在集合中匹配的每个元素周围包裹一个HTML结构，$('p').wrap('

')
.unwrap() ：與wrap方法是相反的。將匹配元素集合的父級元素刪除，保留自身(和兄弟元素,如果存在)再原來的位置
#.wrapAll()：為集合中匹配的元素增加一個外麵包裹HTML結構
wrapInner()：給集合中匹配的元素的內部，增加包裹的HTML結構

##children()方法：是傳回符合元素集合中每個元素的所有子元素
.find()方法：方法ind是遍歷目前元素集合中每個元素的後代。只要符合，不管是兒子輩，孫子輩都可以。
與其他的樹遍歷方法不同，選擇器
表達式對於 .find() 是必要的參數。如果我們需要實現所有後代元素的取回，可以傳遞通配選擇器 '*'。 find只在後代中遍歷，不包括自己。
選擇器context 是由.find() 方法實現的；因此，$('.item-ii').find('li') 等價於$('li', '.item-ii') (找到類別名為item-ii的標籤下的li標籤)。
parent找父類別.parent()

parents()方法：closest()方法closest()方法接受一個符合元素的選擇器字符串從元素本身開始，在DOM 樹上逐級向上級元素匹配，並返回最先匹配的祖先元素

例如：在div元素中，往上查找所有的li元素，可以這樣表達

$("div").closet("li')

next()方法找出後面一個同儕元素

$("li.item-2").css("border","3px solid red");

prev()方法找出前面一個同儕元素

$("li.item-2").prev().css("border","3px solid red");

siblings()方法找出同儕元素

$(".item-2").siblings().css("border","3px solid red");

add()方法

$('li').add('p')

each()方法

$("ul li").each(function(index, element) {  
     index 索引 0,1  
     element是对应的li节点 li,li  
     this 指向的是li  
})

以上就是 jquery之dom學習的所有內容了，希望對大家有幫助吧！

相關推薦：

#jQuery載入一個html頁面到指定的div裡面

jQuery實作點選與滑鼠感應事件

Jquery對新插入的節點綁定Click事件失效的解決方法

以上是jquery之dom學習的詳細內容。更多資訊請關注PHP中文網其他相關文章！