Cet article présente principalement la méthode simple de jQuery pour ajouter dynamiquement de nouveaux éléments à une liste, impliquant des techniques d'implémentation liées à la réponse aux événements jQuery et au fonctionnement dynamique des éléments de page. J'espère que cela pourra aider tout le monde.
Jetons d'abord un coup d'œil aux rendus :
Le code d'implémentation complet est le suivant :
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>www.jb51.net 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>Recommandations associées :
Méthode JavaScript pour supprimer des éléments et ajouter de nouveaux éléments au tableau splice()
Méthode C# pour ajouter dynamiquement de nouveaux éléments au tableau
Partagez trois façons de créer de nouveaux éléments
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!
Que sont les plug-ins jquery ?
Comment faire fonctionner json avec jquery
Comment supprimer des éléments dans jquery
Utilisation de la méthode jQuery hover()
jquery implémente la méthode de pagination
Qu'est-ce qu'un élément caché dans jquery
Qu'est-ce qui est mis en évidence dans jquery
Supprimer l'historique de recherche
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
