Maison > interface Web > js tutoriel > table insertRow, deleteRow définition et utilisation des compétences summary_javascript

table insertRow, deleteRow définition et utilisation des compétences summary_javascript

WBOY
Libérer: 2016-05-16 16:48:24
original
1897 Les gens l'ont consulté

Combien de lignes le tableau contient-il : var trCnt = table.rows.length; (le tableau est Id)

Combien de colonnes contient chaque ligne : for (var i=0; itable.rows [i].cells.length;

table d'opérations javascript :

insertRow(), deleteRow(), insertCell(), méthode deleteCell()

table.insertRow( ) ne pose aucun problème sous IE mais sous Firefox, il doit être remplacé par table.insertRow(-1)
De même, son insertCell() correspondant doit également être modifié par insertCell(-1)

Méthode insertRow()

Définition et utilisation

La méthode insertRow() est utilisée pour insérer une nouvelle ligne à la position spécifiée dans le tableau.

Syntaxe

tableObject.insertRow(index)

Valeur de retour

Renvoie un TableRow représentant la ligne nouvellement insérée.

Description

Cette méthode crée un nouvel objet TableRow, représentant une nouvelle balise , et l'insère dans le tableau à la position spécifiée.

La nouvelle ligne sera insérée avant la ligne à l'index. Si index est égal au nombre de lignes du tableau, la nouvelle ligne sera ajoutée à la fin du tableau.

Si le tableau est vide, la nouvelle ligne sera insérée dans une nouvelle section , qui sera elle-même insérée dans le tableau.

Lance

Si l'index du paramètre est inférieur à 0 ou supérieur ou égal au nombre de lignes du tableau, cette méthode lèvera une exception DOMException avec le code INDEX_SIZE_ERR.

Exemple

Copier le code Le code est le suivant :

< html>
< head>
< script type="text/javascript"> )
}
< /script>
< /head>

< 🎜>< tr>
;/td>

< "bouton" onclick="insRow()"
value="Insérer une nouvelle ligne">

< /body> deleteCell()

Définition et utilisation

La méthode deleteCell() est utilisée pour supprimer des cellules (éléments ) dans les lignes du tableau.

Syntaxe

tablerowObject.deleteCell(index)

Description

Le paramètre index est la position de la cellule du tableau à supprimer dans la ligne.

Cette méthode supprimera l'élément du tableau à la position spécifiée dans la ligne du tableau.

Lance

Si l'index du paramètre est inférieur à 0 ou supérieur ou égal au nombre d'éléments du tableau dans la ligne, cette méthode lancera une DOMException avec le code INDEX_SIZE_ERR.

Exemple




Copier le code


Le code est le suivant :


< html>
< head>
< script type="text/javascript">
fonction delRow()
{
document.getElementById('myTable').deleteRow(0 )
}
< /script> < /head> < 🎜>< tr> ;/td> /tr> "button" onclick="delRow()" value="Supprimer la première ligne">
<
insertCell()

Définition et utilisation La méthode

insertCell() est utilisée pour insérer un élément vide à une position spécifiée dans une ligne d'un tableau HTML.

Syntaxe

tablerowObject.insertCell(index)

Valeur de retour

Un objet TableCell représentant l'élément

Description

Cette méthode créera un nouvel élément et l'insérera dans la ligne à la position spécifiée. La nouvelle cellule sera insérée avant la cellule actuellement à la position spécifiée par index. Si index est égal au nombre de cellules de la ligne, la nouvelle cellule est ajoutée à la fin de la ligne.

Veuillez noter que cette méthode ne peut insérer que des éléments Si vous devez ajouter un élément d'en-tête à une ligne, vous devez créer et insérer un élément à l'aide de la méthode Document.createElement() et de la méthode Node.insertBefore() (ou de méthodes associées).

Lance

Si l'index du paramètre est inférieur à 0 ou supérieur ou égal au nombre d'éléments du tableau dans la ligne, cette méthode lancera une DOMException avec le code INDEX_SIZE_ERR.

Exemple
Copier le code Le code est le suivant :

< html>
< head>
< script type="text/javascript">
fonction insCell()
var x=document.getElementById('tr2'). insertCell(0 )
x.innerHTML="John"
}
< /script< /head> border=" 1">
< tr id="tr1"< th>Prénom
< tr id="tr2">
< < / table>
< br />
< input type="bouton" onclick="insCell()" value="Insérer une cellule"> ;
< /html>


deleteCell()

Définition et utilisation

la méthode deleteCell() est utilisée pour supprimer des cellules dans les lignes du tableau (< ;td> ;

Syntaxe

tablerowObject.deleteCell(index)

Description
Le paramètre index est la position de la cellule du tableau à supprimer dans la ligne.

Cette méthode supprimera l'élément du tableau à la position spécifiée dans la ligne du tableau.

Lance

Si l'index du paramètre est inférieur à 0 ou supérieur ou égal au nombre d'éléments du tableau dans la ligne, cette méthode lancera une DOMException avec le code INDEX_SIZE_ERR.

Exemple




Copier le code


Le code est le suivant :


< html>
< head>
< script type="text/javascript">
fonction delCell()
document.getElementById('tr2').deleteCell(0 ) } < /script> < /head> < id=" tr1"> < th>Prénom th>Nom >
< ;
< input type="bouton" onclick="delCell()" value="Supprimer la cellule">


Application dans le projet :




Copier le code


Le code est le suivant :



É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