La méthode insertBefore() de jQuery est utilisée pour insérer du contenu HTML avant un élément spécifié. Sa syntaxe d'utilisation est "$(content).insertBefore(target)".
L'environnement d'exploitation de cet article : système Windows 7, ordinateur Dell G3, jquery version 3.2.1.
insertBefore() est une méthode intégrée de jQuery, utilisée pour insérer du contenu HTML avant un élément spécifié. L'article suivant vous présentera l'utilisation de insertBefore(), j'espère qu'il vous sera utile.
La méthode insertBefore() de jQuery
la méthode insertBefore() insérera du contenu HTML avant chaque occurrence de l'élément spécifié. [Tutoriel vidéo recommandé : Tutoriel jQuery]
Structure de phrase de base :
$(content).insertBefore(target)
Instructions :
content : représente le contenu HTML qui doit être inséré avant la cible spécifiée.
cible : Indique la cible spécifiée.
Exemple d'utilisation de la méthode insertBefore()
Exemple 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>
Effet Figure :
Description :
Lorsque le DOM (Document Object Model) a été chargé et que la page (y compris les images) a été entièrement rendu, l'événement ready se produit. Cependant, la fonction ready() spécifie le code qui doit être exécuté lorsque l'événement ready se produit.
$(".demo").click() : Indique le code qui doit être exécuté lorsqu'un événement de clic se produit sur l'élément .demo.
Exemple 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>
Rendu :
Ce qui précède représente l'intégralité du contenu de cet article , j'espère que cela pourra être utile à l'étude de chacun. Pour un contenu plus passionnant, vous pouvez prêter attention aux colonnes de didacticiels pertinentes du site Web PHP chinois ! ! !
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!