table 操作 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>table 操作</title>
<script  src="jquery-1.8.3.min.js" type="text/javascript"></script>
<script  src="jquery.query-2.1.7.js" type="text/javascript"></script>
<script>
    $(function(){
        //var table=document.getElementById("table").rows.length;//得到table的长度，rows行数，从1开始
        //var table=document.getElementById("table");//获得table对象
        
        //添加一行：将在第一行中添加第二行
        //var length=document.getElementById("table").rows.length;
        //table.insertRow(length);
        
        //通过id获取值
        //var byId=document.getElementById("first").innerHTML;
        //alert(byId);    //弹出：第一列第一个单元格
        
        //获取table的id 获取指定行的列
        //var byRow=document.getElementById("table").rows[0].cells[1].innerHTML;//这里的rows从0开始、cell从0开始
        //alert(byRow);//弹出第一列第二个单元格
        
        //动态修改某单元格
        //document.getElementById("table").rows[0].cells[0].innerText="aaa";//给一行第一列赋值为aaa
        
        //遍历表格table
        //var tds=document.getElementById('table').getElementsByTagName('td');
        //alert(tds.length);//弹出7 说明获取的td从1开始计算
        //for(var i=0;i<tds.length;i++){ 
            //alert(tds[i].innerText);//循环弹出table里的数据
        //}
        
        //动态添加一个单元格
        var Con=document.getElementById("table"); 
        var len=document.getElementById("table").rows.length;
        var row = Con.insertRow(len); 
        var cell = row.insertCell(0);
        cell.innerHTML = "aaaaa";//效果第二行第一列存在aaaaa
        
    });
</script>
</head>
<body>
    <table border="1" id="table">
        <tr>
            <td id="first">第一列第一个单元格</td>
            <td>第一列第二个单元格</td>
            <td>第一列第三个单元格</td>
            <td>第一列第四个单元格</td>
            <td>第一列第五个单元格</td>
            <td>第一列第六个单元格</td>
            <td>第一列第七个单元格</td>
        </tr>
    </table>
</body>
</html>

虽然现在页面布局很少用到table标签，大部分用到div，据说div比table更好用，更好调样式

不过有时候不能避免会用到table，因为这个还是在某种情况下还是要用到的，既然会用到那就会要操作咯！

posted @ 2014-11-16 13:42  小安妮的熊  Views(254)  Comments(0)  Edit  收藏  举报