oujood.com

jQuery La méthode prependTo() insèrer un contenu au début d'un élément

Les méthodes prepend() et .prependTo() font la même chose. La différence est dans la syntaxe

chercher |

Définition et Usage la méthode prependTo()

La méthode .prependTo() insère le contenu spécifié au début des éléments sélectionnés (toujours à l'intérieur).

Note : Les méthodes prepend() et .prependTo() font la même chose. La différence est dans la syntaxe : le placement du contenu et de sélecteur et de qu'avec prepend() vous pouvez insérer du contenu à l'aide d'une fonction.


Syntaxe

$(contenu).prependTo(sélecteur)



Paramètre

Description

contenu

Obligatoire. Spécifie le contenu à insérer (peut contenir des balises HTML)

sélecteur

Obligatoire. Spécifie quels éléments pour insérer le contenu

Examiner le code HTML suivant :

	<h2>Greetings</h2>

	<div class="container">

	  <div>Bonjour</div>

	  <div>Au revoire</div>

	</div>
	

Nous pouvons créer du contenu et l'insérez dans plusieurs éléments à la fois :

$('<p>Test</p>').prependTo('div ');

Chaque élément interne <div> obtient ce nouveau contenu :

	<h2>Ceci est un titre</h2>
	<div class="conteneur">
	  <div>
		<p>Test</p>
		Bonjour
	  </div>
	  <div>
		<p>Test</p>
		Au revoir
	  </div>
	</div>
	

Nous pouvons également sélectionner un élément sur la page et l'insérez dans un autre :

	$('h2').prependTo($('.container'));
	

Si un élément sélectionné de cette façon est inséré ailleurs, il est déplacé dans la cible ( pas clonée) :

	<div class="container">

	  <h2>Greetings</h2>

	  <div>Bonjour</div>

	  <div>Au revoir</div>

	</div>
	

Exemple : Insérer le contenu au début de chaque élément de p :

Exemple :       Copier le code

<!DOCTYPE html>
<html>
<head>
 <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

 <script>
$(document).ready(function(){
 $("button").click(function(){
 $("<b>Bonjour le
monde!</b> ").prependTo("p");
 });
});
</script>
</head>
<body>
<p>Ceci est un paragraphe.</p>
<p>Ceci est un autre paragraphe.</p>
<button>Insérer le contenu à tous
les éléments p</button>
</body>
</html>
Par gerywa 25 juillet 2014



Voir aussi nos tutoriel :

L'Attribut title d'un élément html

Spécifie des informations supplémentaires sur un élément

fonction substr_replace, substr_replace

Remplace un segment dans une chaîne

fonction vprintf, vprintf

Affiche une chaîne format e