javascript的table 對象 屬性 方法

Table對象集合

Table對象:表示HTML文檔中的表，對于文檔中每個<table>标記，浏覽器都建立一個Table對象.

集合

描述

cells[]擷取包含表格中所有單元格的數組rows[]擷取包含表格中所有行的數組tBodies[]擷取包含表格中所有tbody的數組

Table對象屬性

border設定或擷取表格邊框caption設定或擷取表格标題cellPadding設定或擷取每個單元格邊框與内容的寬度cellSpacing設定或擷取表格中單元格的間距frame設定或擷取表格具有哪些邊框rules設定或擷取表格中的内部邊框summary設定或擷取表格的描述tFoot擷取表格的tFoot對象tHead擷取表格的tHead對象width設定或擷取表格寬度accessKey設定或擷取該對象的快捷鍵align設定或擷取表格行中單元格中文字的水準對齊方向chOff設定或擷取單元格的對齊偏移特征colSpan設定或擷取單元格跨越的表格列數height設定或擷取表格行的高度innerHTML設定或擷取表格行标記間的HTML文本innerText設定或擷取表格行标記間的文本rowIndex擷取表格行對象在表格行集合中的位置sectionRowIndex擷取tBody，tHead或tFoot中，表格行對象在行集合中的位置tabIndex設定或擷取表格行的Tab順序索引vAlign設定或擷取表格行中文字的垂直對齊方向

Table對象方法

createCaption()為表格建立一個空的标題元素createTFoot()為表格建立一個空的tFoot元素createTHead()為表格建立一個空的tHead元素deleteCaption()删除表格的标題元素deleteRow()删除指定的表格行deleteTFoot()删除表格的tFoot元素deleteTHead()删除表格的tHead元素blur()取消該對象的激活狀态click()模拟滑鼠單擊該對象deleteCell([i])删除表格行中的指定的單元格focus()将焦點移至表格行insertCell()在表格行中插入新單元格insertRow()向表格中插入新行  

TableCell對象屬性

TableCell對象:表示HTML文檔中表的單元格，對于文檔中每個 <td>标記，浏覽器都建立一個TableCell對象.

屬性

描述

abbr設定或擷取單元格的摘要align設定或擷取單元格中文字的水準對齊方向axis設定或擷取以逗号分隔的相關單元格組成的清單cellIndex擷取行單元格集合中某單元格的位置ch設定或擷取單元格的對齊特征chOff設定或擷取單元格的對齊偏移特征colSpan設定或擷取單元格跨越的表格列數headers設定或擷取以空格分表頭單元格的id清單height設定或擷取單元格的高度innerHTML設定或擷取單元格标記間的HTML文本noWrap設定或擷取單元格是否自動換行rowSpan設定或擷取單元格跨越的表格行數scope設定或擷取與标題相關聯的資料列vAlign設定或擷取單元格文字的垂直對齊方向width設定或擷取單元格的寬度

怎樣擷取預定義的table的行号和列号呢？很簡單，隻需要了解 table 的幾個屬性值用法即可。Table的總行數可以通過标記“tr” 得到，但是table的列數卻不能直接擷取，它需要借助 rows 通過标記“th” 和“td”得到。為了更直覺，下面以示例來說明如何得到行号和列号。點選 Id 為 'MyTable' 的表格的任意單元時，傳回該單元的行号和列号！示例代碼如下：

      function getRowAndColumn()

      {

              if(!document.getElementsByTagName || !document.createTextNode)return;

             var rows=document.getElementById('MyTable').getElementsByTagName('tr');

             var cols;

             for(i = 0; i < rows.length; i++)

             {

                    rows[i].οnclick=function()

                    {

                           alert("行:"+eval(this.rowIndex + 1));

                    }

                     if(i=0)

                    {

                           colsTH =rows[i].getElementsByTagName('th');

                            alert(colsTH.length);

                           for(k = 0; k< colsTH.length; k++)

                           {

                                  colsTH[k].onclick =function()

                                  {

                                         alert("列:"+eval(this.cellIndex +1));

                                  }

                            }

                     }

                     else

                     {

                           cols =rows[i].getElementsByTagName('td');

                           for(j = 0; j < cols.length; j++)

                           {

                                  cols[j].onclick =function()

                                  {

                                         alert("列:"+eval(this.cellIndex + 1));

                                  }

                            }

                     }

             }

       }

轉載于：http://hi.baidu.com/laogao3232/item/50fc2d2949f1cdf950fd875c