javascript 动态添加表格行 |
||||||
表格 部分代码如下:
动态增加表行的javascript函数如下: function addRow(){ //增加一行 var newTr = testTbl.insertRow(); //增加两列 var newTd0 = newTr.insertCell(); var newTd1 = newTr.insertCell(); //设置列内容和属性 newTd0.innerHTML = box4">; newTd2.innerText= 新加行; } 就这么 方便,做点 详尽的 注明: 1、inserRow()和insertCell()函数 insertRow()函数 可以带参数, 模式如下: insertRow(index) 这个函数将新行增加到index的那一行前, 比方insertRow(0),是将新行增加到第一行之前 。默许的insertRow()函数相当于insertRow(-1),将新行增加到表的最终 。 insertCell()和insertRow的用法 雷同 。 2、动态设置属性和事件 上面行数中的innerHTML和innerText都是列的属性 。 这个inner,便是“inner”到 设置 其余属性也是用同样的 模式, 比方,设置行背 风景 newTr.bgColor = red;
设置事件也一样,需求 方便 注明丝毫 。 比方,我要让点击新加行的时候执行一个自己定义的函数 newClick,newClick行数如下: function newClick(){ alert("这是新增加的行"); } 对onclick事件设置这个函数的代码如下: newTr.onclick = newClick; 这里需求主义的是,=后面的 部分必须是函数名,并且不能带引号, newTr.onclick = newClick(); newTr.onclick = newClick; newTr.onclick = "newClick"; 上面的写法都是 舛误的 。 为何,其实晓得为何没有什么意思,晓得怎么用就OK了,假如不想晓得, 可以跳过下面这一段 。
实际上这个=后面的newClick是指向自己定义的newClick函数的指针,javascript里面函数名便是指向函数的指针,加了引号括号什么的阅读器就找不到那个函数了 。 下面的写法,也是正确的 newTr.onclick = function newClick(){ alert("这是新增加的行"); } 这个 使用函数名实际上是一样的
设置 其余的事件用法 雷同 。 |