谁帮我看看代码，郁闷很久了-慕课网

谁帮我看看代码，郁闷很久了

来源：9-22 编程练习

吃鸟的菜

2015-12-09 18:39

<!DOCTYPE html>
<html>
<head>
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html; charset=gbk"/>
<script type="text/javascript">

      window.onload = function(){

     // 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。
         var rowList=document.getElementsByTagName("tr");
       for(var i=0;i<rowList.length;i++){
       changeColor(rowList[i]);
       }


   }
     function changeColor(obj){
         obj.onmouseover=function(){
             obj.style.backgrounColor="#f2f2f2";
         }
         obj.onmouseout=function(){
             obj.style.backgroundColor="#fff";
         }
     }
      // 编写一个函数，供添加按钮调用，动态在表格的最后一行添加子节点；
    function addRow(){
        var newRow=document.createElement("tr");
        var td1=document.createElement("td");
        var td2=document.createElement("td");
        var td3=document.createElement("td");
        td3.setAttribute("onClick","del(this)");
        td3.innerHTML="删除";
        td3.appendChild(text);
        newRow.appendChild(td1);
        newRow.appendChild(td2);
        newRow.appendChild(td3);
        var table=document.getElementByTagName("table");
        table.appendChild(newRow);
        changeColor(newRow);
    }


     // 创建删除函数
     function del(obj){
         var row=boj.parentNode.parentNode;
         row.parentNode.removeChild(row);
     }
</script>
</head>
<body>
       <table border="1" width="50%" id="table">
       <tr>
       <th>学号</th>
       <th>姓名</th>
       <th>操作</th>
       </tr>
       <tr>
       <td>xh001</td>
       <td>王小明</td>
       <td><a href="javascript:;" onClick="del(this)">删除</a></td>   
       </tr>
       <tr>
       <td>xh002</td>
       <td>刘小芳</td>
       <td><a href="javascript:;" onClick="del(this)">删除</a></td>   
       </tr>
       </table>
       <input type="button" value="添加一行" onClick="addRow()" />   
</body>
</html>

写回答关注

1回答

李晓健: 2015-12-09 18:49:39

<!DOCTYPE html>
<html>
<head>
    <title> new document </title>
    <meta http-equiv="Content-Type" content="text/html; charset=gbk"/>
    <script type="text/javascript">

        window.onload = function(){

            // 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。
            var rowList=document.getElementsByTagName("tr");
            for(var i=0;i<rowList.length;i++){
                changeColor(rowList[i]);
            }


        }
        function changeColor(obj){
            obj.onmouseover=function(){
                obj.style.backgrounColor="#f2f2f2";
            }
            obj.onmouseout=function(){
                obj.style.backgroundColor="#fff";
            }
        }
        // 编写一个函数，供添加按钮调用，动态在表格的最后一行添加子节点；
        function addRow(){
            var newRow=document.createElement("tr");
            var td1=document.createElement("td");
            var td2=document.createElement("td");
            var td3=document.createElement("td");
            var a = document.createElement('a');
            a.setAttribute("onClick","del(this)");
            a.innerHTML="删除";
            td3.appendChild(a);
            newRow.appendChild(td1);
            newRow.appendChild(td2);
            newRow.appendChild(td3);
            var table=document.getElementsByTagName("table")[0];
            table.appendChild(newRow);
            changeColor(newRow);
        }


        // 创建删除函数
        function del(obj){
            var row=obj.parentNode.parentNode;
            row.parentNode.removeChild(row);
        }
    </script>
</head>
<body>
<table border="1" width="50%" id="table">
    <tr>
        <th>学号</th>
        <th>姓名</th>
        <th>操作</th>
    </tr>
    <tr>
        <td>xh001</td>
        <td>王小明</td>
        <td><a href="javascript:;" onClick="del(this)">删除</a></td>   <!--在删除按钮上添加点击事件  -->
    </tr>
    <tr>
        <td>xh002</td>
        <td>刘小芳</td>
        <td><a href="javascript:;" onClick="del(this)">删除</a></td>   <!--在删除按钮上添加点击事件  -->
    </tr>
</table>
<input type="button" value="添加一行" onClick="addRow()" />   <!--在添加按钮上添加点击事件  -->
</body>
</html>

1 0

吃鸟的菜

可以说具体点没

2015-12-09 19:03:33

共 1 条回复 >

JavaScript进阶篇

本课程从如何插入JS代码开始，带您进入网页动态交互世界

468061 学习 · 21891 问题

查看课程

相似问题

为什么我写的代码又运行不了，郁闷

回答 2