注意：jQuery是一個集合，所有很多時候返回值也是一個集合

1.DOM節點的建立

$("html程式碼") 例$("<div></div>")

2.DOM節點的插入

內部隊尾插入：

$(olds).append(new);
$(new).appendTo(olds);

內部隊首插入：

$(olds).prepend(new);
$(new).prependTo(olds);

外部插入:

$(olds).after(new)
$(olds).before(new)
$(new).insertBefore(olds)
$(new).inertAfter(olds)

注：new代表要插入的內容，olds代表被插入的物件們

3.DOM節點的刪除

.empty() 刪除dom節點中的所有內容及繫結事件，但保留此dom節點

remove() 刪除自身及所有後代，包括繫結的事件 $("p").filter(":contains('3')").remove()

.detach() 臨時刪除頁面上的節點，但會保留節點上的資料和事件，當append()相同節點時，事件還存在

4.DOM節點賦值和替換

節點拷貝clone：

$().clone([true]) 不寫true僅僅克隆結構事件丟失，寫true結構，事件和資料都會克隆

節點替換:

$(“olds”).replaceWith( new)，new可以是HTML字串，DOM元素，或者jQuery物件 $(“new”).replaceAll( olds)

節點包裹wrap()，unwrap()，wrapAll()，wrapInner()

.wrap( wrappingElement ) 給單個dom元素包裹

$('p').wrap('<div></div>')  =>
<div>
    <p>p元素</p>
</div>

.wrap( function )

$('p').wrap(function() {
    return '<div></div>';   //與第一種類似，只是寫法不一樣
})

.unwrap() 去除包裹

$('p').unwrap();  =>
<p>p元素</p>
 

.wrapAll( wrappingElement ) 給集合整體包裹

$('p').wrapAll('<div></div>')
<div>
    <p>p元素</p>
    <p>p元素</p>
</div>

.wrapInner( wrappingElement )：給集合中匹配的元素的內部，增加包裹的HTML結構

<div>p元素</div>
<div>p元素</div>  =>
$('div').wrapInner('<p></p>')   =>
<div>
    <p>p元素</p>
</div>
<div>
    <p>p元素</p>
</div>

.wrapInner( function ) :

$('div').wrapInner(function() {
    return '<p></p>'; 
})

5.jQuery遍歷

$().children([selector]) 可以找出所有子元素，selector為選擇器

$().find([selector]) 可以找出所有子孫元素，selector為選擇器

$().parent([selector]) 找出父元素，selector為選擇器

$().parents([selector]) 找出祖輩元素，selector為選擇器 $().closest([selector]) 從元素本身開始查詢，返回最先匹配的祖先元素 closest和parents()的區別：

1起始位置不同：.closest開始於當前元素 .parents開始於父元素 2遍歷的目標不同：.closest要找到指定的目標，.parents遍歷到文 檔根元素，closest向上查詢，直到找到一個匹配的就停止查詢，parents一直查詢到根元素，並將匹配的元素加入集合 3結果不同：.closest返回的是包含零個或一個元素的jquery物件，parents返回的是包含零個或一個或多個元素的jquery物件

$().next() 找到緊跟在其後面符合選擇器的第一個同輩元素 $().prev() 找到緊跟在其後面符合選擇器的第一個同輩元素

$().siblings() 找到指定元素集合中每個元素的所有同輩元素

$().add()

例如：選擇所有的li元素，之後把p元素也加入到li的合集中
<ul>
    <li>list item 1</li>
    <li>list item 3</li>
</ul>
<p>新的p元素</p>
第一種操作：
$('li').add('p')
第二種操作：
$('li').add(document.getElementsByTagName('p')[0])

$().each(function(index,element))遍歷整個jquery集合 index是下標索引，element是對應的元素

$("li").each(function(index, element) {
     index 索引 0,1
     element是對應的li節點 li,li
     this 指向的是li
})