DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> jQuery入門知識 >> JQuery特效代碼 >> juqery 學習之五 文檔處理 插入
juqery 學習之五 文檔處理 插入
編輯:JQuery特效代碼     
append(content)
向每個匹配的元素內部追加內容。
這個操作與對指定的元素執行appendChild方法,將它們添加到文檔中的情況類似。
--------------------------------------------------------------------------------
Append content to the inside of every matched element.
This operation is similar to doing an appendChild to all the specified elements, adding them into the document.
返回值
jQuery
參數
content (String, Element, jQuery) : C要追加到目標中的內容
示例
向所有段落中追加一些HTML標記。
HTML 代碼:
<p>I would like to say: </p>
jQuery 代碼:
$("p").append("<b>Hello</b>");
結果:
[ <p>I would like to say: <b>Hello</b></p> ]
-
--------------------------------------------------------------------------------------------------------------------------------------------------
appendTo(content)
把所有匹配的元素追加到另一個、指定的元素元素集合中。
實際上,使用這個方法是顛倒了常規的$(A).append(B)的操作,即不是把B追加到A中,而是把A追加到B中。
--------------------------------------------------------------------------------
Append all of the matched elements to another, specified, set of elements.
This operation is, essentially, the reverse of doing a regular $(A).append(B), in that instead of appending B to A, you're appending A to B.
返回值
jQuery
參數
content (String) :用於被追加的內容
示例
把所有段落追加到ID值為foo的元素中。
HTML 代碼:
<p>I would like to say: </p><div id="foo"></div>
jQuery 代碼:
$("p").appendTo("#foo");
結果:
<div id="foo"><p>I would like to say: </p></div>
--------------------------------------------------------------------------------------------------------------------------------------------------
prepend(content)
向每個匹配的元素內部前置內容。
這是向所有匹配元素內部的開始處插入內容的最佳方式。
--------------------------------------------------------------------------------
Prepend content to the inside of every matched element.
This operation is the best way to insert elements inside, at the beginning, of all matched elements.
返回值
jQuery
參數
content (String, Element, jQuery) : 要插入到目標元素內部前端的內容
示例
向所有段落中前置一些HTML標記代碼。
HTML 代碼:
<p>I would like to say: </p>
jQuery 代碼:
$("p").prepend("<b>Hello</b>");
結果:
[ <b>Hello</b><p>I would like to say: </p> ]
--------------------------------------------------------------------------------
將一個DOM元素前置入所有段落
HTML 代碼:
<p>I would like to say: </p>
<p>I would like to say: </p>
<b class="foo">Hello</b>
<b class="foo">Good Bye</b>
jQuery 代碼:
$("p").prepend( $(".foo")[0] );
結果:
<p><b class="foo">Hello</b>I would like to say: </p>
<p><b class="foo">Hello</b>I would like to say: </p>
<b class="foo">Hello</b>
<b class="foo">Good Bye</b>
--------------------------------------------------------------------------------
向所有段落中前置一個jQuery對象(類似於一個DOM元素數組)。
HTML 代碼:
<p>I would like to say: </p><b>Hello</b>
jQuery 代碼:
$("p").prepend( $("b") );
結果:
<p><b>Hello</b>I would like to say: </p>
--------------------------------------------------------------------------------------------------------------------------------------------------
prependTo(content)
把所有匹配的元素前置到另一個、指定的元素元素集合中。
實際上,使用這個方法是顛倒了常規的$(A).prepend(B)的操作,即不是把B前置到A中,而是把A前置到B中。
--------------------------------------------------------------------------------
Prepend all of the matched elements to another, specified, set of elements.
This operation is, essentially, the reverse of doing a regular $(A).prepend(B), in that instead of prepending B to A, you're prepending A to B.
返回值
jQuery
參數
content (String) :用於匹配元素的jQuery表達式
示例
把所有段落追加到ID值為foo的元素中。
HTML 代碼:
<p>I would like to say: </p><div id="foo"></div>
jQuery 代碼:
$("p").prependTo("#foo");
結果:
<div id="foo"><p>I would like to say: </p></div>
--------------------------------------------------------------------------------------------------------------------------------------------------
after(content)
在每個匹配的元素之後插入內容。
--------------------------------------------------------------------------------
Insert content after each of the matched elements.
返回值
jQuery
參數
content (String, Element, jQuery) : 插入到每個目標後的內容
示例
在所有段落之後插入一些HTML標記代碼。
HTML 代碼:
<p>I would like to say: </p>
jQuery 代碼:
$("p").after("<b>Hello</b>");
結果:
<p>I would like to say: </p><b>Hello</b>
--------------------------------------------------------------------------------
在所有段落之後插入一個DOM元素。
HTML 代碼:
<b id="foo">Hello</b><p>I would like to say: </p>
jQuery 代碼:
$("p").after( $("#foo")[0] );
結果:
<p>I would like to say: </p><b id="foo">Hello</b>
--------------------------------------------------------------------------------
在所有段落中後插入一個jQuery對象(類似於一個DOM元素數組)。
HTML 代碼:
<b>Hello</b><p>I would like to say: </p>
jQuery 代碼:
$("p").after( $("b") );
結果:
<p>I would like to say: </p><b>Hello</b>
--------------------------------------------------------------------------------------------------------------------------------------------------
before(content)
在每個匹配的元素之前插入內容。
--------------------------------------------------------------------------------
Insert content before each of the matched elements.
返回值
jQuery
參數
content (String, Element, jQuery) : 插入到每個目標前的內容
示例
在所有段落之前插入一些HTML標記代碼。
HTML 代碼:
<p>I would like to say: </p>
jQuery 代碼:
$("p").before("<b>Hello</b>");
結果:
[ <b>Hello</b><p>I would like to say: </p> ]
--------------------------------------------------------------------------------
在所有段落之前插入一個元素。
HTML 代碼:
<p>I would like to say: </p><b id="foo">Hello</b>
jQuery 代碼:
$("p").before( $("#foo")[0] );
結果:
<b id="foo">Hello</b><p>I would like to say: </p>
--------------------------------------------------------------------------------
在所有段落中前插入一個jQuery對象(類似於一個DOM元素數組)。
HTML 代碼:
<p>I would like to say: </p><b>Hello</b>
jQuery 代碼:
$("p").before( $("b") );
結果:
<b>Hello</b><p>I would like to say: </p>
--------------------------------------------------------------------------------------------------------------------------------------------------
insertAfter(content)
把所有匹配的元素插入到另一個、指定的元素元素集合的後面。
實際上,使用這個方法是顛倒了常規的$(A).after(B)的操作,即不是把B插入到A後面,而是把A插入到B後面。
--------------------------------------------------------------------------------
Insert all of the matched elements after another, specified, set of elements.
This operation is, essentially, the reverse of doing a regular $(A).after(B), in that instead of inserting B after A, you're inserting A after B.
返回值
jQuery
參數
content (String) : 用於匹配元素的jQuery表達式
示例
在所有段落之後插入一個元素。與 $("#foo").after("p")相同
HTML 代碼:
<p>I would like to say: </p><div id="foo">Hello</div>
jQuery 代碼:
$("p").insertAfter("#foo");
結果:
<div id="foo">Hello</div><p>I would like to say: </p>
-------------------------------------------------------------------------------------------------------------------------------------------------
insertBefore(content)
把所有匹配的元素插入到另一個、指定的元素元素集合的前面。
實際上,使用這個方法是顛倒了常規的$(A).before(B)的操作,即不是把B插入到A前面,而是把A插入到B前面。
--------------------------------------------------------------------------------
Insert all of the matched elements before another, specified, set of elements.
This operation is, essentially, the reverse of doing a regular $(A).before(B), in that instead of inserting B before A, you're inserting A before B.
返回值
jQuery
參數
content (String) : 用於匹配元素的jQuery表達式
示例
在所有段落之前插入一個元素。與 $("#foo").before("p")相同。
HTML 代碼:
<div id="foo">Hello</div><p>I would like to say: </p>
jQuery 代碼:
$("p").insertBefore("#foo");
結果:
<p>I would like to say: </p><div id="foo">Hello</div>
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved