Я не говорю много чушь, я буду публиковать код напрямую.
<html> <head> <title> Таблица </title> </head> <body> <Таблица границы = 1> <thead> <td> Имя </td> Фамилия </td> <td> </ td> </tr> <thead> <tbody id = tb> <l id = 1st> </td> <td> три </td> <td> <input type = value = add onclick = add ()> <input type = кнопка значение = del onclick = del (this)> </td> </tbody> </body> </html> </html> </html> script> function add () {var trobj = документ . CreateElement (TR); > </td> <td> <input type = 'button' value = 'add' onclick = 'add ()'> <input type = 'button' value = 'del' onclick = 'del (this)'> < /td>; .
В приведенном выше коде, таблица сначала построена в теле.
В примере есть три столбца: первый столбец имени имени, второй столбец и третий столбец в качестве столбца операции.
Столбец работы содержит две операции, одна - добавить линию в форму, а другая - удалить текущую линию. Операции линий добавления и удаления привязаны к двум кнопкам, и когда кнопка нажимается, запускается соответствующая операция Add/ Delete Row.
Метод добавленияФункция add () {var trobj = document.createElement (tr); <input name = 'lastname'/> </td> <td> <input type = 'value =' add 'onclick =' add () '> <input type =' value = 'del' onclick = 'del (это) '> </td>;
Первая строка - создать элемент TR, то есть создать строку таблицы.
В второй строке trObj.id = new Date().getTime();
Третья строка, trObj.innerHTML = <td><input name='firstName'/></td><td><input name='lastName'/></td><td><input type='button' value='Add' onclick='add()'>
<input type='button' value='Del' onclick='del(this)'></td>
; через атрибут innerhtmml.
Четвертая строка, document.getElementById(tb).appendChild(trObj);
Function del (obj) {var trum = obj.parentnode.parentnode.id;
Параметр передается в методе удаления. где это находится.
В первой строке var trId = obj.parentNode.parentNode.id
;
В второй строке var trObj = document.getElementById(trId);
В третьей строке document.getElementById(tb).removeChild(trObj);
Приведенный выше код в основном осознает функцию динамического увеличения счетчика и линий удаления, но в коде есть недостатки.
1 Таблица 1 до и после увеличения, ширина таблицы изменяется
Увеличивать
Увеличивать
После увеличения форма формы становится шире
2 Страница по умолчанию браузера на китайском языке появляется на китайском языке
Вам необходимо установить кодирование символов для изменения формата кодирования страницы, прежде чем его можно будет отображать нормально