資訊專欄INFORMATION COLUMN
摘要：已存在節點是移動，新節點是新增。鏈式操作對象為。將他們的父節點移除。從中刪除所有匹配的元素。一個布爾值或者指示事件處理函數是否會被復制。以上版本默認值是一個布爾值，指示是否對事件處理程序和克隆的元素的所有子元素的數據應該被復制。
前端最基礎的就是 HTML+CSS+Javascript。掌握了這三門技術就算入門，但也僅僅是入門，現在前端開發的定義已經遠遠不止這些。前端小課堂（HTML/CSS/JS），本著提升技術水平，打牢基礎知識的中心思想，我們開課啦（每周四）。
上一節我們講了 jQuery 的基本使用。這節我們講元素節點相關的內容。
內容目錄選擇器
文檔處理
篩選
選擇器選擇器在初級的時候就講過了。上節也簡單的列了一下。這節就找一點騷東西說一說吧。
Sizzle 選擇器引擎先問問DOM的API查找性能，有不知道的嗎？由快到慢 ID > Class > Name > Tag。
CSS 選擇器匹配的順序，有不知道的嗎？從左往右
jQuery的選擇器匹配的順序，有沒有不知道的？Sizzle 選擇器引擎從左往右，當然，既然人家優秀肯定有道理。如果支持更快querySelector會選擇更快的方法。如果有id選擇器，他會先進行id選擇，縮小范圍。感興趣可以去看看Sizzle選擇器引擎介紹，有能力讀源碼當然更好了。
舉個栗子
查詢語句：
$("div span")
代碼結構：
div div div span div span
先查div的話，我們需要遍歷多少次？兩次可以嗎？但是如果先查span，那我們parent去找直到找到頭就完事了。
再說另一個，子節點只有一個父節點。但是父節點會有很多子節點。
文檔處理 append、appendTo 和 prepend、prependTo操作的是父子節點，效果也等同于原生的api。已存在節點是移動，新節點是新增。
parent.append(child) 是將child添加到parent的最后面。鏈式操作對象為parent。對應原生appendChild
child.appendTo(parent) 是將child添加到parent的最后面。鏈式操作對象為child。
parent.prepend(child) 是將child添加到parent的最前面。鏈式操作對象為parent。
child.prependTo(parent) 是將child添加到parent的最前面。鏈式操作對象為child。
insertAfter、after 和 insertBefore、before操作的是兄弟節點，效果同上。
A.after(B) 是在A后面增加B。鏈式操作對象為A
B.insertAfter(A) 是把B增加到A后面。鏈式操作對象為B
A.before(B) 是在A前面增加B。鏈式操作對象為A
B.insertBefore(A) 是把B增加到A前面。鏈式操作對象為B
wrap、unwrap、wrapall、wrapInner、replaceWith、replaceAll說實話這幾個我用都沒用過。
$("a").wrap("") 是指，將所有a標簽，用后面的節點包起來。
$("li").unwrap()將他們的父節點移除。也就是說所有子節點占據了原來父級的位置。
$("a").wrapAll("") 是指，將所有到標簽都合并到第一個位置，并且包裹起來。
$("a").wrapInner("")是指，講a標簽的內容，用b標簽包裹起來。
$("a").replaceWith(" 將所有的a標簽，用新標簽替換。那么鏈式操作對象是誰？
$(" 用新標簽替換，把所有的a標簽替換。那么鏈式操作對象是誰？
empty、remove、detach$("a").empty() 刪除匹配的元素集合中所有的子節點。
$("a").remove() 從DOM中刪除所有匹配的元素。這個方法不會把匹配的元素從jQuery對象中刪除，因而可以在將來再使用這些匹配的元素。但除了這個元素本身得以保留之外，其他的比如綁定的事件，附加的數據等都會被移除。
$("a").detach() 從DOM中刪除所有匹配的元素。這個方法不會把匹配的元素從jQuery對象中刪除，因而可以在將來再使用這些匹配的元素。與remove()不同的是，所有綁定的事件、附加的數據等都會保留下來。
clone([Event[,deepEven]])克隆一個副本出來。我們知道，如果這個元素是文檔內的，那么上面的方法會變成移動。當我們不想移動的時候，就需要clone。
event: 一個布爾值（true 或者 false）指示事件處理函數是否會被復制。V1.5以上版本默認值是：false
deepEven: 一個布爾值，指示是否對事件處理程序和克隆的元素的所有子元素的數據應該被復制。
篩選hasClass(class) 判斷當前元素有沒有對應class。比如我們在模擬復選框，我們需要判斷當前的狀態。$(this).hasClass("checked")
filter(class) 比如我們現有一個所有復選框的合集，我們要過濾出所有選中狀態的。
next() 獲取下一個元素
nextAll() 獲取后面所有元素
nextUntil() 獲取后面所有元素，可以設置終止條件。
parent()、prev() 基本有next()相識的方法
siblings() 獲取所有兄弟元素
end() 我覺得這個方法就很厲害，把當前的鏈式操作對象移交給上次。
$("p").find("span").end()目前操作對象是$("p")
等等…… 我就列舉這些常用的吧。
微信公眾號：前端linong 初級階段文章目錄前端培訓-初級階段（17） - 數據存儲（cookie、session、stroage）
前端培訓-初級階段（13） - 正則表達式
前端培訓-初級階段（13） - 類、模塊、繼承
前端培訓-初級階段（13） - ECMAScript （內置對象、函數）
前端培訓-初級階段（13） - ECMAScript （語法、變量、值、類型、運算符、語句）
前端培訓-初級階段（13、18）
前端培訓-初級階段（9 -12）
前端培訓-初級階段（5 - 8）
前端培訓-初級階段（1 - 4）
中級階段文章目錄前端培訓-中級階段（2） - 事件(event) 事件冒泡、捕獲 - （2019-06-20期）
前端培訓-中級階段（3） - DOM 文檔對象模型（2019-06-27期）
前端培訓-中級階段（4）- BOM 瀏覽器對象模型（2019-07-04期）
前端培訓-中級階段（5）- jQuery的概念與基本使用（2019-07-11期）
資料前端培訓目錄、前端培訓規劃、前端培訓計劃
jQuery 速查地址
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/105118.html
摘要：已存在節點是移動，新節點是新增。鏈式操作對象為。將他們的父節點移除。從中刪除所有匹配的元素。一個布爾值或者指示事件處理函數是否會被復制。以上版本默認值是一個布爾值，指示是否對事件處理程序和克隆的元素的所有子元素的數據應該被復制。 前端最基礎的就是 HTML+CSS+Javascript。掌握了這三門技術就算入門，但也僅僅是入門，現在前端開發的定義已經遠遠不止這些。前端小課堂（HTML/...
摘要：前端最基礎的就是。幫助從舊的事件方法轉換，和。方法移除用綁定的事件處理程序。特定的事件處理程序可以被移除元素上提供事件名稱，命名空間，處理函數。用于過濾器的觸發事件的選擇器元素的后代。事件觸發模擬觸發原生使用觸發。 前端最基礎的就是 HTML+CSS+Javascript。掌握了這三門技術就算入門，但也僅僅是入門，現在前端開發的定義已經遠遠不止這些。前端小課堂（HTML/CSS/JS）...
摘要：前端最基礎的就是。幫助從舊的事件方法轉換，和。方法移除用綁定的事件處理程序。特定的事件處理程序可以被移除元素上提供事件名稱，命名空間，處理函數。用于過濾器的觸發事件的選擇器元素的后代。事件觸發模擬觸發原生使用觸發。 前端最基礎的就是 HTML+CSS+Javascript。掌握了這三門技術就算入門，但也僅僅是入門，現在前端開發的定義已經遠遠不止這些。前端小課堂（HTML/CSS/JS）...
摘要：前端最基礎的就是。對應，是標簽的屬性。獲取匹配元素相對父元素的偏移。返回的對象包含兩個整型屬性和。一組包含作為動畫屬性和終值的樣式屬性和及其值的集合動畫的額外選項。指示是否在效果隊列中放置動畫。 前端最基礎的就是 HTML+CSS+Javascript。掌握了這三門技術就算入門，但也僅僅是入門，現在前端開發的定義已經遠遠不止這些。前端小課堂（HTML/CSS/JS），本著提升技術水平，...
摘要：前端最基礎的就是。對應，是標簽的屬性。獲取匹配元素相對父元素的偏移。返回的對象包含兩個整型屬性和。一組包含作為動畫屬性和終值的樣式屬性和及其值的集合動畫的額外選項。指示是否在效果隊列中放置動畫。 前端最基礎的就是 HTML+CSS+Javascript。掌握了這三門技術就算入門，但也僅僅是入門，現在前端開發的定義已經遠遠不止這些。前端小課堂（HTML/CSS/JS），本著提升技術水平，...
閱讀 1408·2021-09-23 11:21
閱讀 3105·2019-08-30 14:14
閱讀 3187·2019-08-30 13:56
閱讀 4136·2019-08-30 11:20
閱讀 1949·2019-08-29 17:23
閱讀 2765·2019-08-29 16:14
閱讀 1693·2019-08-28 18:18
閱讀 1490·2019-08-26 12:14
