~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
開發工具與關鍵技術：vs JavaScript
作者：王民
撰寫時間：2020年5月2日
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
知識點羅列：
先前我就總結過JavaScript物件模型總結(DOM)。現在是在vs中jQuery進行DOM節點
的一些簡單的操作
JavaScript中創建DOM節點
創建流程：
1.創建元素 document.createElement()
2.為節點添加一下屬性 element.setAttribute();
3.可以使用innerText或則innerHTML屬性添加文本或則HTML內容
4.使用parentElement.appendChild()方法將新創建的節點添加到父節點中
jQuery節點的創建:$()函式處理，$("html結構")
jQuery創建的節點是一個jQuery物件
DOM物件與jQuery物件的區別
.DOM物件是通過原生的JS獲取的物件，DOM物件只能使用JS中的方法和屬性
.jQuery物件是通過jQuery包裝DOM物件后產生的物件，它是jQuery獨有的。
jQuery可以使用jQuery庫里面的方法，但是不能使用JS中的方法
1.append()與appendTo()方法
append(content|fn):向每個匹配的元素內部追加內容
$(A).append(B);將B添加到A中
appendTo(content):把所有匹配的元素追加到另一個指定的元素元素集合中。
$(A).appendTo(B);把A追加到B中
總結：這兩個方法功能相同，主要的不同是語法—>內容和目標的位置不同
2.repend()與prependTo()方法
prepend(content):向每個匹配的元素內部前置內容
$(A).prepend(B);將B添加到A中(和append添加的元素有位置上的區別)
prependTo(content):把所有匹配的元素前置到另一個、指定的元素元素集合中。
$(A).prependTo(B);把A追加到B中
3.after()與before() 方法
after(content|fn):在每個匹配的元素之后插入內容。
$(A).after(B); 在A后面插入B元素
before(content|fn):在每個匹配的元素之前插入內容。
$(A).before(B);在A前面插入B元素
4.insertAfter()與insertBefore()
insertAfter(content):把所有匹配的元素插入到另一個、指定的元素元素集合的后面。
$(A).insertAfter(B) 在B后面插入A元素 與$(A).after(B)是相反的操作，但是功能一樣
insertBefore(content):把所有匹配的元素插入到另一個、指定的元素元素集合的前面。
$(A).insertBefore(B) 在B前面面插入A元素 與$(A).before(B)是相反的操作，但是功能一樣
5jQuery洗掉節點的方法 remove()與 empty()方法
5.1 empty() 洗掉匹配的元素集合中所有的子節點
5.2 remove([expr]) 從DOM中洗掉所有匹配的元素。expr:用于篩選元素的jQuery運算式
5.3 detach() 從DOM中洗掉所有匹配的元素。
這個方法不會把匹配的元素從jQuery物件中洗掉，因而可以在將來再使用這些匹配的元素.與remove()不同的是，所有系結的事件、附加的資料等都會保留下來. $("div").detach()這一句會移除物件，僅僅是顯示效果沒有了。但是記憶體中還是存在的。當你append之后，又重新回到了檔案流中。就又顯示出來了。
eq(index|-index):獲取當前鏈式操作中第N個jQuery物件，回傳jQuery物件，當引數大于等于0時為正向選取，比如0代表第一個，1代表第二個。當引數為負數時為反向選取，比如-1為倒數第一個，具體可以看以下示例。
類似的有get(index),不過get(index)回傳的是DOM物件。
引數說明：index 一個整數，指示元素基于0的位置,這個元素的位置是從0算起。
-index 一個整數，指示元素的位置，從集合中的最后一個元素開始倒數。(-1算起)
first() 獲取第一個元素
last()獲取最后個元素
hasClass(class) 檢查當前的元素是否含有某個特定的類，如果有，則回傳true
這其實就是 is("." + class)。
filter(expr|obj|ele|fn) 篩選出與指定運算式匹配的元素集合。
這個方法用于縮小匹配的范圍。用逗號分隔多個運算式
find(expr|obj|ele)
搜索所有與指定運算式匹配的元素。這個函式是找出正在處理的元素的后代元素的好方法
通過JavaScript操作DOM與jQuery操作DOM的對比。我們不難發現：
標準的JavaScript操作DOM與jQuery操作DOM的對比，通過jQuery方法包裝后的物件，是一個類陣列物件。它與DOM物件完全不同，唯一相似的是它們都能操作DOM。
通過jQuery處理DOM的操作，可以讓開發者更專注業務邏輯的開發，
而不需要我們具體知道哪個DOM節點有那些方法，
也不需要關心不同瀏覽器的兼容性問題，
我們通過jQuery提供的API進行開發，代碼也會更加精短。
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/77572.html
標籤：非技術區
上一篇：tomcat7插件問題