Maison > interface Web > js tutoriel > Les soldats de la liste d'actions jQuery y ajoutent dynamiquement de nouveaux éléments

Les soldats de la liste d'actions jQuery y ajoutent dynamiquement de nouveaux éléments

php中世界最好的语言
Libérer: 2018-04-19 14:00:02
original
1460 Les gens l'ont consulté

Cette fois, je vais vous présenter jQuery pour ajouter dynamiquement de nouveaux éléments à une liste de soldats, et quelles sont les précautions pour utiliser jQuery pour ajouter dynamiquement de nouveaux éléments à une liste de soldats. Voici quelques exemples de cas pratiques.

Le code d'implémentation complet est le suivant :

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery列表添加新元素</title>
<script src="jquery-1.7.2.min.js"></script>
</head>
<body>
<h3>li列表:</h3>
<ol>
    <li>jb51</li>
    <li>php</li>
    <li>javascript</li>
    <li>HTML5</li>
</ol>
<input type="text" id="text">
<input type="button" id="btn" value="添加">
<script type="text/javascript">
 $(function () {
    $('#btn').click(function () {
      $('ol').append('<li>'+$('#text').val()+'</li>');
    });
});
</script>
</body>
</html>
Copier après la connexion

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de PHP !

Lecture recommandée :

Utilisez JS pour renvoyer le code de vérification après 60 secondes

Traversée et interception de chaînes JS, Opérations de sortie et de calcul

JS implémente une fonction de chargement et de pagination illimitée sur le terminal mobile

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