Maison > interface Web > js tutoriel > Comment utiliser la méthode insertBefore() de jQuery

Comment utiliser la méthode insertBefore() de jQuery

青灯夜游
Libérer: 2021-04-22 15:31:02
original
5099 Les gens l'ont consulté

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)".

Comment utiliser la méthode insertBefore() de jQuery

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)
Copier après la connexion

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>
Copier après la connexion

Effet Figure :

Comment utiliser la méthode insertBefore() de jQuery

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>
Copier après la connexion

Rendu :

Comment utiliser la méthode insertBefore() de jQuery

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal