Introduction à la façon d'ajouter de nouvelles lignes à une table à l'aide de jQuery

jQuery est une bibliothèque JavaScript populaire largement utilisée dans le développement Web. Lors du développement Web, il est souvent nécessaire d'ajouter dynamiquement de nouvelles lignes aux tableaux via JavaScript. Cet article explique comment utiliser jQuery pour ajouter de nouvelles lignes à une table et fournit des exemples de code spécifiques.

Tout d'abord, nous devons introduire la bibliothèque jQuery dans la page HTML. La bibliothèque jQuery peut être introduite dans la balise

via le code suivant :

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

Ensuite, nous supposons qu'il existe une table avec l'identifiant "myTable" et la structure est la suivante :

<table id="myTable">
  <tr>
    <td>姓名</td>
    <td>年龄</td>
  </tr>
  <tr>
    <td>张三</td>
    <td>25</td>
  </tr>
  <tr>
    <td>李四</td>
    <td>30</td>
  </tr>
</table>

Maintenant, nous voulons pour ajouter ce qui suit au tableau via la nouvelle ligne jQuery. Voici un exemple de code utilisant jQuery :

// 创建一个新的<tr>元素
var newRow = $('<tr>');

// 为新行添加<td>元素和内容
newRow.append('<td>王五</td>');
newRow.append('<td>28</td>');

// 将新行添加到表格中
$('#myTable').append(newRow);

Le code ci-dessus crée d'abord un nouvel élément <tr>元素，然后通过<code>append()方法为新行添加<td> et un nouveau contenu, et ajoute enfin une nouvelle ligne à la table avec l'identifiant "myTable". <p>Avec l'exemple de code ci-dessus, nous pouvons implémenter la fonction d'ajout de nouvelles lignes au tableau à l'aide de jQuery. L'ajout de nouvelles lignes affiche non seulement les données de manière dynamique, mais améliore également l'expérience utilisateur. J'espère que cet article vous a été utile et je vous souhaite du succès dans le développement Web ! </p> </td>

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!