Maison  >  Article  >  interface Web  >  Comment ajouter des éléments à l'aide de la méthode append dans jQuery

Comment ajouter des éléments à l'aide de la méthode append dans jQuery

不言
不言original
2018-12-28 17:35:096292parcourir

La méthode append est une méthode qui peut ajouter dynamiquement des éléments html. Il est très pratique d'utiliser la méthode append. Vous pouvez ajouter n'importe quel nombre de lignes d'éléments html. ajouter la méthode.

Comment ajouter des éléments à laide de la méthode append dans Comment ajouter des éléments à laide de la méthode append dans Comment ajouter des éléments à laide de la méthode append dans jQuery

Comment utiliser la méthode append ?

$(‘选择器’).append(‘添加的内容’);

Après avoir spécifié la classe et l'ID dans le sélecteur, appelez append et spécifiez ce qu'il faut ajouter.

Regardons un exemple précis

Ajoutez l'élément li dans la balise ul en cliquant sur le bouton, le code est le suivant

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <script>
      $(function() {
        $("button").click(function() {
          $("ul").append("<li>添加的内容</li>");
        });
      });
    </script>
  </head>
  <body>
    <button>button</button>
    <ul>
    </ul>
  </body>
</html>

Créez un déclencheur pour être déclenché lorsque l'on clique sur le bouton, puis exécutez la méthode append.

Écrivez une méthode d'ajout pour le sélecteur, spécifiez la balise ul et ajoutez la balise li au sélecteur.

Ainsi, chaque fois que vous appuyez sur le bouton, la méthode append est appelée et le nombre d'éléments est incrémenté.

L'effet d'affichage sur le navigateur est le suivant

Comment ajouter des éléments à laide de la méthode append dans Comment ajouter des éléments à laide de la méthode append dans Comment ajouter des éléments à laide de la méthode append dans jQuery

Lorsque vous cliquez sur le bouton, un élément de contenu apparaîtra à chaque fois que vous cliquez dessus. L'effet de cinq clics est le suivant :

Comment ajouter des éléments à laide de la méthode append dans Comment ajouter des éléments à laide de la méthode append dans Comment ajouter des éléments à laide de la méthode append dans jQuery

Cet article se termine ici 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!

Déclaration:
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