ホームページ > 記事 > ウェブフロントエンド > jQueryのinsertBefore()メソッドの使い方
jQuery の insertBefore() メソッドは、指定された要素の前に HTML コンテンツを挿入するために使用されます。その使用構文は「$(content).insertBefore(target)」です。
この記事の動作環境: Windows 7 システム、Dell G3 コンピューター、jquery バージョン 3.2.1。
insertBefore() は jQuery の組み込みメソッドで、指定された要素の前に HTML コンテンツを挿入するために使用されます。 insertBefore()の使い方については以下の記事で紹介していますので、ご参考になれば幸いです。
jQuery の insertBefore() メソッド
insertBefore() メソッドは、指定された要素が出現するたびに HTML コンテンツを挿入します。 [ビデオチュートリアルの推奨: jQuery チュートリアル]
基本的な文構造:
$(content).insertBefore(target)
手順:
content: 指定されたターゲットの前に挿入する必要がある HTML コンテンツを示します。
target: 指定されたターゲットを示します。
InsertBefore() メソッドの使用例
例 1:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script type="text/javascript" src="jquery.min.js"></script> <script> $(document).ready(function() { $(".demo").click(function() { // insertBefore $("<div>在PHP中文网中学习!</div>").insertBefore("p"); }); }); </script> </head> <body> <div class="box"> <p>学习jQuery</p> <div class="demo">单击此处</div> </div> </body> </html>
レンダリング:
説明:
DOM (ドキュメント オブジェクト モデル) がロードされ、ページ (画像を含む) が完全にレンダリングされると、準備完了イベントが発生します。ただし、ready() 関数は、ready イベントが発生したときに実行する必要があるコードを指定します。
$(".demo").click(): .demo 要素でクリック イベントが発生したときに実行する必要があるコードを示します。
例 2:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script type="text/javascript" src="jquery.min.js"></script> <script> $(document).ready(function() { $(".demo").click(function() { // insertBefore $("<div>在PHP中文网中学习!</div>").insertBefore("p"); }); }); </script> </head> <body> <div class="box"> <p>学习jQuery</p> <p>学习php</p> <div class="demo">单击此处</div> </div> </body> </html>
レンダリング:
上記がこの記事の全内容です。皆様の学習のお役に立てれば幸いです。さらにエキサイティングなコンテンツについては、PHP 中国語 Web サイトの関連チュートリアルのコラムに注目してください。 ! !
以上がjQueryのinsertBefore()メソッドの使い方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。