Maison interface Web js tutoriel Analyse de l'utilisation de append() et appendto() dans jquery_jquery

Analyse de l'utilisation de append() et appendto() dans jquery_jquery

May 16, 2016 pm 04:31 PM
append jquery 用法

Cet article analyse l'utilisation de append() et appendto() dans jquery avec des exemples. Partagez-le avec tout le monde pour votre référence. L'analyse spécifique est la suivante :

Dans la méthode d'opération de document de jQuery, les méthodes append() et appendto() effectuent les mêmes tâches, mais il existe également des différences entre les deux.

1. Méthode append() : Insérer le contenu spécifié à la fin de l'élément sélectionné (mais toujours dans l'élément).

a. Syntaxe :

Copier le code Le code est le suivant :
$(selector).append(content );
Parmi eux, le paramètre content est obligatoire, précisant le contenu à ajouter.

b.append peut utiliser des fonctions pour ajouter du contenu aux éléments sélectionnés. La syntaxe est :

Copiez le code Le code est le suivant :
$(selector).append(function(index,html));
Parmi eux, function() est obligatoire, et les paramètres index et html sont facultatifs. Index représente la position d'index du sélecteur de réception et html représente le code HTML actuel du sélecteur de réception.

Exemple :

Copier le code Le code est le suivant :
<html> <tête> <script type="text/javascript" src="/jquery/jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){
$("bouton").click(function(){
$("p").append(" <b>Bonjour jQuery!</b>"); });
});
</script> </tête> <corps> <p>Ceci est un paragraphe.</p> <p>Ceci est un autre paragraphe.</p> <bouton>Ajouter du contenu à la fin de chaque élément p</bouton> </corps> </html>


Les résultats en cours d'exécution sont les suivants :

Ceci est un paragraphe. Bonjour jQuery !
Ceci est un autre paragraphe. Bonjour jQuery !


2. Méthode appendto() :
Insérez le contenu spécifié à la fin de l'élément sélectionné (mais toujours à l'intérieur de l'élément). Mais vous ne pouvez pas utiliser de fonctions pour ajouter du contenu.

Syntaxe :

Copier le code


Le code est le suivant :

$(content).appendto(selector);

Exemple :

Le code est le suivant :
<html> <tête> <script type="text/javascript" src="/jquery/jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("bouton").click(function(){

$("<b> Bonjour jQuery !</b>").appendTo("p"); });
});

</script> </tête> <corps> <p>Ceci est un paragraphe.</p> <p>Ceci est un autre paragraphe.</p> <bouton>Ajouter du contenu à la fin de chaque élément p</bouton> </corps> </html> Les résultats en cours d'exécution sont les suivants : Ceci est un paragraphe. Bonjour jQuery ! Ceci est un autre paragraphe. Bonjour jQuery !
J'espère que cet article sera utile à la programmation jQuery de chacun.
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

Article chaud

Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Article chaud

Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Tags d'article chaud

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Comment utiliser la méthode de requête PUT dans jQuery ? Comment utiliser la méthode de requête PUT dans jQuery ? Feb 28, 2024 pm 03:12 PM

Comment utiliser la méthode de requête PUT dans jQuery ?

Comment supprimer l'attribut height d'un élément avec jQuery ? Comment supprimer l'attribut height d'un élément avec jQuery ? Feb 28, 2024 am 08:39 AM

Comment supprimer l'attribut height d'un élément avec jQuery ?

Explication détaillée et introduction à l'utilisation de la fonction MySQL ISNULL Explication détaillée et introduction à l'utilisation de la fonction MySQL ISNULL Mar 01, 2024 pm 05:24 PM

Explication détaillée et introduction à l'utilisation de la fonction MySQL ISNULL

Conseils jQuery : modifiez rapidement le texte de toutes les balises a de la page Conseils jQuery : modifiez rapidement le texte de toutes les balises a de la page Feb 28, 2024 pm 09:06 PM

Conseils jQuery : modifiez rapidement le texte de toutes les balises a de la page

Utilisez jQuery pour modifier le contenu textuel de toutes les balises Utilisez jQuery pour modifier le contenu textuel de toutes les balises Feb 28, 2024 pm 05:42 PM

Utilisez jQuery pour modifier le contenu textuel de toutes les balises

Utilisation correcte de la requête POST en PHP Utilisation correcte de la requête POST en PHP Mar 27, 2024 pm 03:15 PM

Utilisation correcte de la requête POST en PHP

Comprendre le rôle et les scénarios d'application de eq dans jQuery Comprendre le rôle et les scénarios d'application de eq dans jQuery Feb 28, 2024 pm 01:15 PM

Comprendre le rôle et les scénarios d'application de eq dans jQuery

Comment utiliser la fonction sommeil ? Comment utiliser la fonction sommeil ? Mar 20, 2024 am 08:37 AM

Comment utiliser la fonction sommeil ?

See all articles