<script language="javascript">
function createTr(){
var tb=document.all.tb
var tr=tb.insertRow()
var td=tr.insertCell()
td.innerHTML="test"
td.onclick=clickMe
}
function clickMe(){
alert("事件")
}
</script>
<body>
<table id="tb" border="2">
<tr>
<td onclick="createTr()">click me</td>
</tr>
</table>
</body>
</html>
<html><head>
<title>动态增加、删除table中的tr示例</title>
<script language="javascript">
//添加行函数
function addrow(){
//得到table对象
var mytable = document.getElementById("testtable")
//向table中插入一行
var mytr=mytable.insertRow()
//创建一个新的td对象
var mytd=document.createElement("td")
//创建一个新的<input >对象
var inputtext=document.createElement("<INPUT name='ok'>")
//设置input对象的type属性
inputtext.setAttribute("type","text")
//初始化td中的文本信息
mytd.innerText="输入关键字:"
//向td中加入input对象
mytd.appendChild(inputtext)
//向tr中加入td对象
mytr.appendChild(mytd)
}
//删除行
function deleterow(){
//得到table对象
var mytable = document.getElementById("testtable")
//得到table中的行对象数组
var arr=mytable.rows
if(arr.length==1){
alert("至少存在一行")
}else{
//删除最后一行
arr[arr.length-1].removeNode(true)
}
}
</script>
</head>
<body>
<h2>table中动态增加、删除行示例</h2>
<table>
<tr>
<td>
<table id="testtable">
<tr><td>输入关键字:<input type="text" name="name"></td></tr>
</table>
</td>
</tr>
<tr>
<td>
<input type="button" onclick="addrow()" value="增加">
<input type="button" onclick="deleterow()" value="删除">
</td>
</tr>
</table>
</body>
</html>
说明：把此代码赋值到一个html文件中就可以直接运行
第一：使用 (/* nbsp */) 这是最简单的第二：可以使用<div></div>，利用style 设置其高度、宽度
第三：使用<p></p>, 利用style设置其高度、宽度
第四：使用表格<table><td></td><tr></tr></table>,做一个一行一列的表格，设置单元表格的宽度
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）