JavaScript相關知識

如何隱藏table中的某幾行呢? 
只要爲你要隱藏的行設置好id就可以了。 
<table> 
<tr id=aaa>
<td>aaa</td>
</tr> 
<tr id=bbb>
<td>bbb</td>
</tr> 
<tr>
<td>ccc</td>
</tr>
</table>
<script language="javascript"> 
document.getElementById("aaa").style.display="none"; 
document.getElementById("bbb").style.display="none"; 
</script>
如何用javascript動態設置td的值?
<table> <tr> <td id="tdSee"> </td> </tr> </table> 
<hr /> 
<input id="tdStr" type="text" value="xxx" />
<input value="設置給td" type="button" οnclick="changTD()" />
<script language="javascript">
function changTD(){
document.getElementById("tdSee").innerHTML=document.getElementById("tdStr").value 
}
</script>

 
動態生成表格 
<script language="javascript">
function add_row(){
if ((document.getElementById("name").value=="")||(document.getElementById("pass").value==""))
{
   alert("值不能爲空"); 
   return 0;
}
var tableobj=document.getElementById("table_1");
var rowobj=tableobj.insertRow(tableobj.rows.length);
var cell1=rowobj.insertCell(rowobj.cells.length);
var cell2=rowobj.insertCell(rowobj.cells.length); 
var cell3=rowobj.insertCell(rowobj.cells.length); 
cell1.innerHTML=document.getElementById("name").value; 
cell2.innerHTML=document.getElementById("pass").value;
cell3.innerHTML=
"<input type='button' value='刪除' οnclick='delete_row("+(tableobj.rows.length-1)+");leo()'>";
document.getElementById("name").value="";
document.getElementById("pass").value="";
 }
function leo()  //當刪除一行後,對各行重新建立索引!!! ——leo
{
var tableobj=document.getElementById("table_1");
for(i=1;i<tableobj.rows.length;i++) 
 {      
tableobj.rows[i].cells[2].innerHTML=
"<input type='button' value='刪除' οnclick='delete_row("+i+");leo()'>"; 
  } 
}
function delete_row(i)
{ 
var tableobj=document.getElementById("table_1"); alert("刪除第"+i+"行"); 
tableobj.deleteRow(i); 
} 
</script>
<div align="center">
<input name="name" type="text">
<input name="pass" type="text"> 
<input name="add" type="button" onClick="add_row()" value="添加"> 
</div> 
<div align="center"> 
<table id="table_1" border="1">
<tr> <td>帳號</td><td>密碼</td><td>操作</td> </tr> 
</table> 
</div> 
 JavaScript的Table表格對象
Table對象集合
集合 描述
cells[]獲取包含表格中所有單元格的數組
rows[]獲取包含表格中所有行的數組
tBodies[]獲取包含表格中所有tbody的數組
Table對象屬性
border設置或獲取表格邊框
caption設置或獲取表格標題
cellPadding設置或獲取每個單元格邊框與內容的寬度
cellSpacing設置或獲取表格中單元格的間距
frame設置或獲取表格具有哪些邊框
rules設置或獲取表格中的內部邊框
summary設置或獲取表格的描述
tFoot獲取表格的tFoot對象
tHead獲取表格的tHead對象
width設置或獲取表格寬度
Table對象方法
createCaption()爲表格創建一個空的標題元素
createTFoot()爲表格創建一個空的tFoot元素
createTHead()爲表格創建一個空的tHead元素
deleteCaption()刪除表格的標題元素
deleteRow()刪除指定的表格行
deleteTFoot()刪除表格的tFoot元素
發佈了23 篇原創文章 · 獲贊 5 · 訪問量 16萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章