Aide à la programmation, réponses aux questions / Javascript / Ajout d'une autre ligne dans une table en utilisant javascript - javascript, html

Ajouter une autre ligne dans une table en utilisant javascript - javascript, html

J'ai créé une table. J'ai besoin d'ajouter une nouvelle ligne en utilisant javascript. Quelqu'un peut-il le réparer.

<head>
<script>
var num=1;
function addrow(){
num++;
var x = document.getElementById("add");
x.innerHTML= x.innerHTML +"<tr><td>Content_"+num+"</td></tr>";
}
</script>
<title>Add new row with js</title>
</head>
<body>

<table>
<tr><td>Content_1</td></tr>
//* I wanted to add a new row here *//
<tr><td>Content_End</td><td><button onclick="addrow()">+</button></td></tr>
</table>
</body>

Je voulais ajouter une nouvelle ligne entre les lignes !! Quelqu'un peut-il aider? Merci d'avance!

Réponses:

1 pour la réponse № 1

Fais-le comme ça

<head>
<script>
var num=1;
function addrow(){

var table = document.getElementById("add");
var row = table.insertRow(num);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);

cell1.innerHTML = "NEW CELL"+num;
cell2.innerHTML = "NEW CELL"+num;
num++;
}
</script>
<title>Add new row with js</title>
</head>
<body>

<table id="add">
<tr><td colspan="2">Content_1</td></tr>
<tr><td>Content_End</td><td><button onclick="addrow()">+</button></td></tr>
</table>
</body>

Violon : Démo

1 pour la réponse № 2

var num=1;
function addrow(){

var table = document.getElementById("add");
var row = table.insertRow(num);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);

cell1.innerHTML = "NEW CELL"+num;
cell2.innerHTML = "NEW CELL"+num;
num++;
}

Cela fonctionnerait :)

0 pour la réponse № 3

Vous avez oublié d'ajouter le id à votre table. Vous ne pouvez pas non plus avoir différents nombres de tds par ligne. Si vous voulez qu'une cellule prenne l'espace de deux colonnes, ajoutez colspan="2"

<head>
<script>
var num=1;
function addrow(){
num++;
var x = document.getElementById("add");
x.innerHTML= x.innerHTML +"<tr><td>Content_"+num+"</td></tr>";
}
</script>
<title>Add new row with js</title>
</head>
<body>

<table id="add">
<tr><td colspan="2">Content_1</td></tr>
<tr><td>Content_End</td><td><button onclick="addrow()">+</button></td></tr>
</table>
</body>