用jQuery實現簡單的DOM操作

標籤：清空   div   index   dom操作   dex   bsp   建立   建立   remove   

通過jQuery建立元素節點：$oLi = $("<li></li>");這樣我們就建立了一個li標籤

如果想在元素節點中添加文本的話也挺簡單：$oLi = $("<li>文本</li>");這樣就可以在元素節點中添加文本了；

當然如果你要寫一個動態文本也可以：$oLi = $("<li>"+index+"</li>");這樣子，只要把你所獲得的文本賦給變數index就行了；

如果要寫一些有屬性，類名，id名的元素節點也挺簡單：$oLi = $("<li title=‘title‘ class=‘li‘ id=‘lI‘></li>);在添加屬性和類名時別忘了和外圍的引號區分開來；

向匹配的元素內部追加內容：$("ul").append("<li></li>");

將所有匹配的元素追加到指定的元素中：$("<li></li>").appendTo("ul");

將每個匹配的元素內部前置添加符合的元素：$("<li></li>").prepend("ul");

將元素添加到每個匹配的元素內部前置：$("<li></li>").prependTo("ul);

向匹配的元素後面添加元素，新添加的元素作為目標元素後的緊鄰的兄弟元素：$("p").after("<div></div>;

將建立的元素插入到尋找到的目標元素後，作為目標元素的兄弟節點：$("<p></p>").insertAfter("span");

在每一個匹配的元素之前插入，做為匹配元素的前一個兄弟節點：$("p").before("<span></span>");

將建立元素添加到目標元素前，做為目標元素的前一個兄弟節點：$("<a href=‘#‘>錨點</a>).inserBefore("ul");

當然如果有不想要的節點咱也可以刪除

比如：刪除所有匹配的元素 $("ul").remove();匹配的所有元素都刪除；

還有：$("ul").empty();匹配的所有元素清空子項目，看清楚是清空不是刪除；

 

用jQuery實現簡單的DOM操作