ホームページ >ウェブフロントエンド >jsチュートリアル >jQueryの関数append()とappendto()の使い方の比較説明

jQueryの関数append()とappendto()の使い方の比較説明

巴扎黑
巴扎黑オリジナル
2017-06-24 11:21:232105ブラウズ

この記事では、例を通して jquery の append() と appendto() の使用法を分析します。皆さんの参考に共有してください。具体的な分析は次のとおりです。

jQuery のドキュメント操作メソッドでは、append() メソッドと appendto() メソッドは同じタスクを実行しますが、この 2 つには違いもあります。

1. append() メソッド: 指定されたコンテンツを選択した要素の末尾に挿入します (ただし要素の内部にあります)。

a. 構文:

コードは次のとおりです:


$(selector).append(content);

このうちパラメータの内容は必須であり、追加する内容を指定します。

b と append は、関数 を使用して、選択した要素にコンテンツを追加できます。 構文は次のとおりです。

コードは次のとおりです。


$(selector).append(function(index,html));

その中で、function() が必須であり、パラメータindexとhtmlはオプションです。 Index は受信セレクターのインデックス位置を表し、html は受信セレクターの現在の HTML を表します。

例:

コードは次のとおりです:


 1 100db36a723c770d327fc0aef2ce13b1 
 2 93f0f5c25f18dab9d176bd4f6de5d30e 
 3 e237a888ddddb6a569e64fe57f33f83d2cacc6d41bbb37262a98f745aa00fbf0 
 4 8019067d09615e43c7904885b5246f0a 
 5 $(document).ready(function(){ 
 6   $("button").click(function(){ 
 7     $("p").append(" a4b561c25d9afb9ac8dc4d70affff419Hello jQuery!0d36329ec37a2cc24d42c7229b69747a"); 
 8   }); 
 9 }); 
10 2cacc6d41bbb37262a98f745aa00fbf0 
11 9c3bca370b5104690d9ef395f2c5f8d1 
12 6c04bd5ca3fcae76e30b72ad730ca86d 
13 e388a4556c0f65e1904146cc1a846beeThis is a paragraph.94b3e26ee717c64999d7867364b1b4a3 
14 e388a4556c0f65e1904146cc1a846beeThis is another paragraph.94b3e26ee717c64999d7867364b1b4a3 
15 bb9345e55eb71822850ff156dfde57c8在每个 p 元素的结尾添加内容65281c5ac262bf6d81768915a4a77ac0 
16 36cc49f0c466276486e50c850b7e4956 
17 73a6ac4ed44ffec12cee46588e518a5e
実行結果は次のとおりです:

これは、Hello jQuery!

これは別の段落です。 () メソッド:
In 指定されたコンテンツを選択した要素の末尾に挿入します (ただし、要素の内部にはまだあります)。ただし、関数を使用してコンテンツを追加することはできません。

文法: コードは次のとおりです:

$(content).appendto(selector);

例:


コードは次のとおりです:

 1 100db36a723c770d327fc0aef2ce13b1 
 2 93f0f5c25f18dab9d176bd4f6de5d30e 
 3 e237a888ddddb6a569e64fe57f33f83d2cacc6d41bbb37262a98f745aa00fbf0 
 4 8019067d09615e43c7904885b5246f0a 
 5 $(document).ready(function(){ 
 6   $("button").click(function(){ 
 7     $("a4b561c25d9afb9ac8dc4d70affff419 Hello jQuery!0d36329ec37a2cc24d42c7229b69747a").appendTo("p"); 
 8   }); 
 9 }); 
10 2cacc6d41bbb37262a98f745aa00fbf0 
11 9c3bca370b5104690d9ef395f2c5f8d1 
12 6c04bd5ca3fcae76e30b72ad730ca86d 
13 e388a4556c0f65e1904146cc1a846beeThis is a paragraph.94b3e26ee717c64999d7867364b1b4a3 
14 e388a4556c0f65e1904146cc1a846beeThis is another paragraph.94b3e26ee717c64999d7867364b1b4a3 
15 bb9345e55eb71822850ff156dfde57c8在每个 p 元素的结尾添加内容65281c5ac262bf6d81768915a4a77ac0 
16 36cc49f0c466276486e50c850b7e4956 
17 73a6ac4ed44ffec12cee46588e518a5e
実行結果は次のとおりです:


こんにちは jQuery です。 !

これは別の段落です。こんにちは jQuery !

この記事が皆さんの jQuery プログラミングに役立つことを願っています。


以上がjQueryの関数append()とappendto()の使い方の比較説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。