Não digo muito bobagem, vou publicar o código diretamente.
<html> <head> <title> tabela </title> </ading> <body> <tabela borda = 1> <Tead> <td> primeiro nome </td> sobrenome </td> <td> <// td> </tr> <tead> <tbody id = tb> <l id = 1st> </td> <td> três </td> <td> <tipo de entrada = button value = add onclick = add ()> <Tipo de entrada = Valor do botão = del onclick = del (this)> </td> </tbody> </body> </html> </html> </html> script> função add () {var trobj = document .CreateElement (TR); > </td> <td> <input type = 'button' value = 'add' onclick = 'add ()'> <input type = 'button' value = 'del' onclick = 'del (this)'> < /TD>; RemoveChild (Trobj);} </sCript>No código acima, uma tabela é construída pela primeira vez no corpo.
Existem três colunas no exemplo, a primeira coluna do primeiro nome, o sobrenome da segunda coluna e a terceira coluna como a coluna de operação.
A coluna de operação contém duas operações, uma é adicionar uma linha ao formulário e a outra é excluir a linha atual. As operações das linhas de adição e exclusão estão vinculadas a dois botões e, quando o botão é clicado, a operação de linha de adição/ exclusão correspondente é acionada.
Método de adição Função add () {var trobj = documental.createElement (tr); <Nome de entrada = 'Sobrenome'/> </td> <td> <input type = 'button' value = 'add' onclick = 'add ()'> <input type = 'value =' del 'onclick =' del (isto) '> </td>;A primeira linha é criar um elemento TR, ou seja, criar uma linha de tabela.
Na segunda linha, trObj.id = new Date().getTime();
Terceira linha, 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> ; Através do atributo InnerHTMML.
A quarta linha, document.getElementById(tb).appendChild(trObj);
Função del (obj) {var trum = obj.parentnode.parentnode.id;Um parâmetro é transmitido no método de exclusão. onde isso está localizado.
Na primeira linha, var trId = obj.parentNode.parentNode.id ;
Na segunda linha, var trObj = document.getElementById(trId);
Na terceira linha, document.getElementById(tb).removeChild(trObj);
O código acima realiza basicamente a função do aumento dinâmico do medidor e das linhas de exclusão, mas existem falhas no código.
1 Tabela 1 antes e depois do aumento, a largura da tabela muda
Aumentar
Aumentar
Após o aumento, a forma da forma se torna mais ampla
2 A página padrão do navegador em chinês aparece em chinês
Você precisa definir a codificação do caractere para modificar o formato de codificação da página antes que ele possa ser exibido normalmente