一、創(chuàng)建新元素

1、使用$函數(shù)創(chuàng)建新元素

var $newElement=$('

段落

');//創(chuàng)建元素,返回jQuery對象

說明：

1)創(chuàng)建的新元素不會自動的把新元素插入到頁面中，我們還需要明確的指定其插入到頁面中的位置(比如使用append方法，指定

其插入位置為某個元素的最后一個子元素)

2)返回的jQuery對象中只包含html片段最頂層(外層)的元素，對于后代元素我們可以像處理頁面中已有元素一樣，使用

children或find方法訪問 也就是說alert($newElement);的結(jié)果應(yīng)為1

3)既然可以直接apend等方法插入html元素為何還要有這個創(chuàng)建新元素的功能？

使用$函數(shù)創(chuàng)建元素，是返回的是jQuery對象，我們可以使用jQuery對象里面的方法在創(chuàng)建的這個元素被插入到頁面之前進行

各種操作比如進行綁定事件處理函數(shù)！

2、克隆已有的元素(通過克隆已有元素生成新元素)

使用clone方法以已有的元素(或者新創(chuàng)建的元素)為模子生成新元素

clone方法會復(fù)制jQuery對象內(nèi)包含后代元素在內(nèi)的所有元素

參數(shù)：

兩個參數(shù)都是可選

第一個參數(shù)：

一個布爾值(true 或者 false)指示目標元素的事件處理函數(shù)以及關(guān)聯(lián)數(shù)據(jù)是否會被復(fù)制

第二個參數(shù)(默認情況下與第一個參數(shù)一致)：

一個布爾值，指示是否對克隆的元素的所有子元素的事件處理程序以及關(guān)聯(lián)數(shù)據(jù)進行復(fù)制

二、添加子元素

1、append方法

在每個匹配元素內(nèi)的 末尾處插入?yún)?shù)內(nèi)容

參數(shù)類型說明：

1)普通字符串(可包含各種html標簽)

$('body').append('html字符串');

2)jQuery對象

①使用$函數(shù)創(chuàng)建的新元素(jQuery對象)

②使用$函數(shù)獲取頁面中已經(jīng)有的元素(jQuery對象)

此時會將已有的元素移動到目標元素內(nèi)，就是被剪切了

1

2 $(function(){3 $getParagraph=$("p");//運行后p段落會變成div的子元素4 $("#oo").append($getParagraph);5 }6 );7

8

9

段落

10

div

③使用clone方法克隆頁面中已經(jīng)有的元素(jQuery對象)

$getParagraph=$("p").clone();//這樣就避免了p段落會變成div的子元素

3)html元素對象、html元素對象數(shù)組

====以上類型的參數(shù)可傳入多個，每個參數(shù)都會被插入到匹配元素！===

4)函數(shù)

有多少個匹配元素，這個函數(shù)就會執(zhí)行多少次！

函數(shù)可以接受到兩個參數(shù)：第一個是當前元素的序號、第二個是當前元素內(nèi)的html

函數(shù)內(nèi)部this代表當前的html元素對象

return 的數(shù)據(jù)就是插入的內(nèi)容(可以為html元素，也可以是jQuery對象)

2、prepend方法

將參數(shù)內(nèi)容插入到每個匹配元素內(nèi)部的 最前面

使用方法及參數(shù)與append相同

3、appendTo方法

將匹配的元素插入到目標元素內(nèi)部的最后面(同append)

與append區(qū)別：

使用時目標元素與插入內(nèi)容的位置 顛倒

創(chuàng)建新元素返回的jQuery對象與

選擇頁面中已有元素返回的jQuery對象都可調(diào)用此方法(選擇頁面中已有元素表示將已有的元素移動到目標元素內(nèi))！

參數(shù)(表示要插入元素的目標位置)：

Selector或者jQuery對象或者html元素對象/html元素對象數(shù)組

4、prependTo方法

將匹配的元素插入到目標元素內(nèi)部的最前面(同prepend)

與prepend區(qū)別：

同上！

參數(shù)(表示要插入元素的目標位置)：

同上！

總結(jié)

以上是生活随笔為你收集整理的jquery生成一个li_jquery-创建元素和添加子元素的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。