html表格怎么自增长度,js 自增table （练习）

//table自增表

//这段代码编写的目的，仅仅作为js练习和总结而已，代码很多地方写的多余和臃肿,

//设计的不是很合理,在实际应用中，根据具体需求而定

function addNum(){

this.name = "addNum";

this.brothersLength ;//兄弟节点的长度

this.itselfNode ;//当前自身td

this.upperNode;//table节点

this.brothersNodes; //兄弟节点

this.appendNodes ; //新增节点

this.deleteButton; //删除按钮

this.deleteTrNode = function(obj){

//alert(this.name)

this.upperNode.removeChild(obj.parentNode.parentNode)

}

}

addNum.prototype.init = function(){

this.itselfNode = event.srcElement;

this.brothersNodes = this.itselfNode.parentNode.parentNode.childNodes ;

this.brothersLength = this.brothersNodes.length;

this.upperNode = this.itselfNode.parentNode.parentNode.parentNode;//table

this.appendNodes = document.createElement("tr"); //新增tr节点

this.appendNodes.name = "newTr";

this.deleteButton =document.createElement("input");//name='del' value='[-]' type='button'

this.deleteButton.name = 'del';

this.deleteButton.value = '[-]';

this.deleteButton.type = 'button';

itself = this;//this 引用

this.deleteButton.onclick = function(){

itself.deleteTrNode(this);//这里的this指向当前button对象

} ;

//this.deleteButton.attachEvent('onclick',function(){itself.deleteTrNode(this);}) //attachEvent中this指向是当前对象

}

addNum.prototype.addBrothersNodesNoValue = function(){

this.init();

for(var i = 0 ; i

appendNode= this.brothersNodes[i].cloneNode(true);//clone节点所有内容和属性

itselfChildNodes = appendNode.childNodes ;

for(j=0;j

if(("INPUT"==itselfChildNodes[j].nodeName) && ("text"==itselfChildNodes[j].type)){ //

itselfChildNodes[j].value = "";

}

}

if(i == this.brothersLength-1){

while(appendNode.firstChild){ //等价于itselfChildNodes.length > 0

appendNode.removeChild(appendNode.firstChild)

}

appendNode.appendChild(this.deleteButton) ;

}

this.appendNodes.appendChild(appendNode);//新增tr节点

}

this.upperNode.appendChild(this.appendNodes);

}

var autoAdd = new addNum();

1

2

3newBUTTON_1

4newBUTTON_1

[+]