接著上一篇繼續(xù)...

創(chuàng)新互聯(lián)建站長(zhǎng)期為上1000+客戶提供的網(wǎng)站建設(shè)服務(wù)，團(tuán)隊(duì)從業(yè)經(jīng)驗(yàn)10年，關(guān)注不同地域、不同群體，并針對(duì)不同對(duì)象提供差異化的產(chǎn)品和服務(wù)；打造開(kāi)放共贏平臺(tái)，與合作伙伴共同營(yíng)造健康的互聯(lián)網(wǎng)生態(tài)環(huán)境。為沅陵企業(yè)提供專業(yè)的做網(wǎng)站、網(wǎng)站制作，沅陵網(wǎng)站改版等技術(shù)服務(wù)。擁有十載豐富建站經(jīng)驗(yàn)和眾多成功案例,為您定制開(kāi)發(fā)。

三、設(shè)置元素內(nèi)容

針對(duì)通過(guò)修改元素的HTML方法來(lái)達(dá)到修改元素內(nèi)容，jQuery提供了多種方法來(lái)實(shí)現(xiàn)。

1、替換HTML或文本內(nèi)容

這個(gè)應(yīng)該不用解釋了，我們都學(xué)習(xí)了那么多方法了。

另外也可以只獲取或設(shè)置元素的文本內(nèi)容。

舉個(gè)例子：有如下HTML片段。

  
One
  
Two
  
Three
  
Four

var text = $("#theList").text();

則text的結(jié)果是OneTwoThreeFour。

需要說(shuō)明的是，無(wú)論用html()還是text()都是對(duì)原先內(nèi)容的覆蓋，所以使用前必須確認(rèn)好。

2、移動(dòng)和復(fù)制元素

舉例說(shuō)明：

$("p").append("some text");

這句比較簡(jiǎn)單，就是表示在所有

元素后面追加新的HTML片段。下面是稍稍復(fù)雜的用法。

$("p.sugar").append($("a.ant"));

這表示什么呢？在帶有類.sugar的所有

元素后面追加帶有類ant的鏈接。這里的追加有點(diǎn)說(shuō)道。如果append里的是單一元素，那么將該元素從原來(lái)的位置上刪除掉，移動(dòng)到新的父元素下。如果是多個(gè)元素，即是一個(gè)內(nèi)容大于等于1的集合，那么在原來(lái)位置保留的情況下，會(huì)在新的父元素下追加集合中的副本。

前者可以理解為移動(dòng)操作，后者則是復(fù)制操作。

如果不想追加整個(gè)包裝集，也可以單獨(dú)追加一個(gè)特定的DOM元素。如：

var toAppend = $("a.ant")[0];
$("p.sugar").append(toAppend);

這種情況下對(duì)于追加的toAppend是所謂的移動(dòng)還是復(fù)制，要取決于$("p.sugar")的元素?cái)?shù)量（注意：與上面的例子不同，上面是取決于追加元素的數(shù)量）。如果匹配一個(gè)元素進(jìn)行移動(dòng)操作。多個(gè)，則進(jìn)行復(fù)制操作。

還有更簡(jiǎn)單的方法：

同樣的，如果target只匹配一個(gè)元素，則是移動(dòng)，如果是多個(gè)元素，則是復(fù)制。

再介紹幾個(gè)工作方式類似于append和appendTo的方法。

prepend()和prependTo()表示在目標(biāo)元素的內(nèi)容之前插入源元素，而不是之后。

before()和insertBefore()表示在目標(biāo)元素之前插入元素，而不是在目標(biāo)元素的第一個(gè)子元素之前。

after()和insertAfter()表示目標(biāo)元素之后插入元素，而不是在目標(biāo)元素的最后一個(gè)子元素之后。

3、包裹元素

什么叫包裹元素呢？妹的，看書讀文字把我都搞成漿糊了還沒(méi)弄明白所謂的包裹元素，又沒(méi)有例子是弄哪樣？我才不會(huì)這么不負(fù)責(zé)任。

舉個(gè)例子：

$("a.surprise").wrap("
");

上面的例子就是對(duì)應(yīng)紫色的部分，把頁(yè)面上所有帶有類surprise的鏈接外面套層帶有類hello的

...
 one
 two
 three
...
轉(zhuǎn)換后
...

     one


     two


     three

...

$("a.surprise").wrap($("div:first")[0]);

$("[name=radioGroup]:checked").val();

$("input, select").val(['ironman','superman','spiderman']);