知識點一：創建節點
注意：Jquery創建元素節點、屬性節點、文本節點都使用$(html) 1.創建元素節點：$("<li></li>"); 2.創建屬性節點：$("<li id='test'></li>"); 3.創建文本節點：$("hello world !"); 4.下面是創建三者的結合：$("<li id='test'>hello world !</li>"); 解釋：4是創建一個id屬性為test，文本節點為hello world !的li節點
知識點二：獲得節點
主要是jQuery的選擇器：下面說下最基礎的幾個 選擇器 格式 舉例 1.id選擇器 $("#id的屬性值") $("#name"); 2.class選擇器 $(".class的屬性值") $(".name") 3.標簽選擇器 $("html標簽") $("p") 4.*選擇器 $("*") $("*") 5.群組選擇器 $("選擇器1,選擇器二,...") $("p,#name")
知識點三：插入節點
內部插入（當做子節點插入）： append(content|fn) 向每個匹配的元素內部末尾追加內容。 appendTo(content) 把所有匹配的元素追加到另一個指定的元素元素集合末尾。 prepend(content|fn) 向每個匹配的元素內部頭部內容。 prependTo(content) 把所有匹配的元素追加到另一個指定的元素元素集合頭部 外部插入（當做兄弟節點插入）： after(content|fn) 向每個匹配元素的后面添加內容 before(content|fn) 向每個匹配元素的前面添加內容 insertAfter(content) 把所有匹配的元素插入到另一個、指定的元素元素集合的后 面。 insertBefore(content) 把所有匹配的元素插入到另一個、指定的元素元素集合的 前面。
內部插入（當做子節點插入）案例：
<div id="div1"> <p id="one">我是第一個p標簽</p> <p id="two">我是第二個p標簽</p> </div> <p id="three">我是第三個p標簽</p> <script> var p3 = $("#three"); var div = $("#div1"); </script>
1.append()實例
div.append(p3)
執行完，結果網頁結果為：
<div id="div1"> <p id="one">我是第一個p標簽</p> <p id="two">我是第二個p標簽</p> <p id="three">我是第三個p標簽</p> </div>
總結：
1.可以看出append()方法，可以將id=three的p標簽添加進了div中 2.這是我們也發現，原來位置上的id=three的p標簽會被刪除，等於是實際上是移動div里 面去了，也就是說在使用append()的時候，如果被添加元素會被移動到要添加的元素里面 了。
2.appendTo()實例：
p3.appendTo(div)
結果為：
<div id="div1"> <p id="one">我是第一個p標簽</p> <p id="two">我是第二個p標簽</p> <p id="three">我是第三個p標簽</p> </div>
總結：
1.結果和append()執行完是一樣的，只是顛倒了一下位置而已
3.prepend()實例：
div.prepend(p3);
結果為：
<div id="div1"> <p id="three">我是第三個p標簽</p> <p id="one">我是第一個p標簽</p> <p id="two">我是第二個p標簽</p> </div>
4.prependTo()實例：
p3.prependTo(div)
結果為：
<div id="div1"> <p id="three">我是第三個p標簽</p> <p id="one">我是第一個p標簽</p> <p id="two">我是第二個p標簽</p> </div>
外部插入（當做子節點插入）案例：
<div id="div1"> <p id="one">我是第一個p標簽</p> </div> <p id="two">我是第二個p標簽</p> <p id="three">我是第三個p標簽</p> <script> var p1 = $("#one"); var div = $("#div1"); </script>
1.after()
div.after(p1);
結果為；
<div id="div1"></div> <p id="one">我是第一個p標簽</p> <p id="two">我是第二個p標簽</p> <p id="three">我是第三個p標簽</p>
總結：
1.第一個p標簽插入到了div的后面 2.第一個p標簽在div中的移除 3.插入的過程相當於將第一個p標簽從div中移動到div的后面
2.
div.before(p1) ;
結果：
<p id="one">我是第一個p標簽</p> <div id="div1"></div> <p id="two">我是第二個p標簽</p> <p id="three">我是第三個p標簽</p>
3.insertAfter()案例：
p1.insertAfter(div);
結果：
<div id="div1"></div> <p id="one">我是第一個p標簽</p> <p id="two">我是第二個p標簽</p> <p id="three">我是第三個p標簽</p>
總結：
1。結果跟after()一樣，只是顛倒了位置
4.insertBefore()案例：
p1.insertBefore(div);
結果：
<p id="one">我是第一個p標簽</p> <div id="div1"></div> <p id="two">我是第二個p標簽</p> <p id="three">我是第三個p標簽</p>
總結：
1。結果跟before()一樣，只是顛倒了位置