?? sample4_2.htm
字號:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>無標題文檔</title>
<script language="javascript">
function reverseTable() {
var table_node = document.getElementById("table1"); //第一個表格
var child = table_node.getElementsByTagName("tr"); //取得表格內的所有行
var newChild = new Array(); //定義緩存數組，保存行內容
for(var i=0;i<child.length;i++) {
newChild[i] = child[i].firstChild.innerHTML;
}
/*1.直接交換每個節點中的innerHTML中的內容
var j=0;
for(var i=child.length-1;i>=0;i--) {
child[i].firstChild.innerHTML=newChild[j++];
}*/
/*/2。刪除原來的table，重新建立行內，并且插入參數
table_node.removeChild(table_node.childNodes[0]); //刪除全部單元行，也就是刪除<table>和<tr>之間的<tbody>節點
var header = table_node.createTHead(); //新建表格行頭
for(var i=0;i<newChild.length;i++) {
var headerrow = header.insertRow(i); //插入一個單元行,（）內的參數表示，在當前節點內，第i行進行插入
var cell = headerrow.insertCell(0); //在單元行中插入一個單元格
//在單元格中創建TextNode節點
cell.appendChild(document.createTextNode(newChild[newChild.length-i-1]));
}*/
//*3。定位節點，刪除該節點，將刪除的節點添加到新的父節點后面.
var tbody_node = table_node.firstChild;//獲得table節點的子節點，tbody
var tr_node = tbody_node.childNodes;//獲得tbody的所有子節點，tr
for(i=tr_node.length-1;i>=0;i--){
var c = tbody_node.removeChild(tr_node[i]);
tbody_node.appendChild(c);
}
}
</script>
</head>
<body>
<table width="200" border="1" cellpadding="4" cellspacing="0" id="table1">
<tr>
<td height="25">第一行</td>
</tr>
<tr>
<td height="25">第二行</td>
</tr>
<tr>
<td height="25">第三行</td>
</tr>
<tr>
<td height="25">第四行</td>
</tr>
</table>
<br>
<input type="button" name="reverse" value="開始顛倒" onClick="reverseTable()">
</body>
</html>
?? 快捷鍵說明
復制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -