Помощ при програмиране, отговори на въпроси / Javascript / Добавяне на друг ред в таблица с помощта на javascript - javascript, html

Добавяне на друг ред в таблица с помощта на javascript - javascript, html

Създадох таблица. Трябва да добавя нов ред с помощта на JavaScript. Може ли някой да го поправи.

<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>

Исках да добавя нов ред между редовете !! Може ли някой да помогне? Благодаря предварително!

Отговори:

1 за отговор № 1

Направи го като това

<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>

цигулка : Демонстрация

1 за отговор № 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++;
}

Това ще работи :)

0 за отговор № 3

Забравихте да добавите id до вашата маса. Също така не можете да имате различен брой tds на ред. Ако искате една клетка да заеме пространството от две колони, след това добавете 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>