怎样用js来控制table的高度

JavaScript015

怎样用js来控制table的高度,第1张

方法只有一种。

步骤:

1、获取table的dom节点

2、通过js设置table的height属性

代码示例

<body>

<table id='test' border='1'> 定义一个table

<tr>

  <td>111</td><td>222</td>

</tr>

</table>

<script>

var tb = document.getElementById('test')//获取table的dom节点

tb.setAttribute('height',300)//设置table高度为300

</script>

setAttribute("width","200")设置属性

setAttribute("属性名","属性值")

用insertRow()添加行

insertCell()添加列

<html>

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312">

<title>增加Table行</title>

</head>

<script>

function addRow(obj)

{

//添加一行

var newTr = testTbl.insertRow()

//添加两列

var newTd0 = newTr.insertCell()

var newTd1 = newTr.insertCell()

//设置列内容和属性

newTd0.innerHTML = '<input type=checkbox id="box4">'

newTd1.innerText= '新加行'

}

</script>

<body>

<table id="testTbl" border=1>

<tr id="tr1">

<td ><input type=checkbox id="box1"></td>

<td id="b">第一行</td>

</tr>

<tr id="tr2">

<td ><input type=checkbox id="box2"></td>

<td id="b">第二行</td>

</tr>

<tr id="tr3">

<td ><input type=checkbox id="box3"></td>

<td>第三行</td>

</tr>

</table>

<br />

<input type="button" id="add" onClick="addRow()" value="Add Row" />

</body>