jquery_jquery での .add() の使用に関する分析-jsチュートリアル-php.cn

jquery_jquery での .add() の使用に関する分析

WBOY

リリース： 2016-05-16 17:35:16

オリジナル

981 人が閲覧しました

add() 一致する要素のコレクションに要素を追加します。これは、jquery リファレンスマニュアルに記載されているステートメントです。ただし、提供されているサンプルのリンクが間違っているため、add() のサンプルの説明はありません。 add() の使用法をよりよく理解するための例をいくつか示します。

例 1

コードをコピーしますコードは次のとおりです:

<script> <br> $(document).ready(function(){<br> $("div").css("border", "2px 単色赤").add("p").css("background", "黄色" );<br>});<br></script>

< ;div>

gt;

;< /div>

これを追加しました… (境界線がないことに注意してください)

結果は以下のようになります:

説明: ここでの add("p") は、$("div") の CSS と p の CSS の合計を意味します。ここで、div には境界線があることに注意してください。そして、pはそうではありません。

例 2

コードをコピーしますコードは次のとおりです:

こんにちは

またこんにちは

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

$("p").add("span").css("背景", "黄色" );

結果は以下のようになります:

p および Span CSS、

と同等

$("p,span").css("background","yellow");

ログイン後にコピー

例 3:

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

こんにちは

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

$("p").clone().add("Again").appendTo(document.body) ;

結果は次のとおりです:

Clone() は、p をコピーし、ドキュメントの本文に Again を挿入することを意味します。

ここに文を挿入します: clone() が使用されない場合、元の p は存在しなくなります。次の例を見てください。

コードをコピーしますコードは次のとおりです。

< script>
$ (document).ready(function(){
 $("p").add("Again").appendTo(document.body);
alert($(" body").html());
});

結果は以下のようになります:

例 4:

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

こんにちは

またこんにちは

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

$("p").add( document.getElementById ("a")).css("background", " yellow");

結果は次のとおりです:

これは、add() のパラメーターがセレクターだけでなく DOM 要素にもなり得ることを示しています。