为了账号安全,请及时绑定邮箱和手机立即绑定

为什么三个function都没有效果

改变背景,添加一行和删除,这三个function我的code都没有working, 希望大家帮忙看看问题在哪里,谢谢。

<!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 tr = document.getElementsByTagName(tr); 
		for (var i=0; i<tr.length;i++){
    	 background(tr[i]);   
		}
        function background(obj){
            obj.onmouseover = function(){
                obj.style.backgroundColor = "#f2f2f2";
            }
            obj.onmouseout = function(){
                obj.style.backgroundColor = "#fff";
            }    
            }
            
        }
     
	 
	 }
     var num = 2
      // 编写一个函数,供添加按钮调用,动态在表格的最后一行添加子节点;
     function add(){
         num ++;
         var tr1 = document.createElement("tr");
         var td1 = document.createElement("td");
         var td2 = document.createElement("td");
         var td3 = document.createElement("td");
         td1.innerHTML = "xh00"+num;
         td2.innerHTML = num;
         td3.innerHTML = "<a href="javascript:;" >删除</a>";
         var tr = document.getElementsByTagName("tr");
         tr.parentNode.lastChild.appendChild(tr1);
         tr1.appendChild(td1);
         tr1.appendChild(td2);
         tr1.appendChild(td3);
         
     }
     
     function delete(obj){
         var tr = obj.parentNode.parentNode;
         tr.parentNode.removeChild(tr);
     }		
   	 
     // 创建删除函数
     


  </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="delete(this);" >删除</a></td>   <!--在删除按钮上添加点击事件  -->
	   </tr>

	   <tr>
		<td>xh002</td>
		<td>刘小芳</td>
		<td><a href="javascript:;" onclick="delete(this);">删除</a></td>   <!--在删除按钮上添加点击事件  -->
	   </tr>  

	   </table>
	   <input type="button" value="添加一行" onclick="add()" />   <!--在添加按钮上添加点击事件  -->
 </body>
</html>


正在回答

1 回答

<!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 tr = document.getElementsByTagName(tr);
        for (var i=0; i<tr.length;i++){
         background(tr[i]);  
        }
        function background(obj){
            obj.onmouseover = function(){
                obj.style.backgroundColor = "#f2f2f2";
            }
            obj.onmouseout = function(){
                obj.style.backgroundColor = "#fff";
            }   
          }  
        }
     var num = 2//上面多了一个大括号

     function add(){

         num ++;

         var tr1 = document.createElement("tr");
         var td1 = document.createElement("td");
         var td2 = document.createElement("td");
         var td3 = document.createElement("td");
         td1.innerHTML = "xh00"+num;
         td2.innerHTML = num;
         td3.innerHTML = "<a href=\"javascript:;\" onclick=\"del(this);\" >删除</a>";//这行改了一下
         var table = document.getElementById("table");//这里改了
         table.lastChild.appendChild(tr1);//这里改了
         tr1.appendChild(td1);
         tr1.appendChild(td2);
         tr1.appendChild(td3);
     }

     function del(obj){ //这里用了关键字改成del
         var tr = obj.parentNode.parentNode;
         tr.parentNode.removeChild(tr);
     }    

  </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="add()" />   <!--在添加按钮上添加点击事件  -->

 </body>

</html>

1 回复 有任何疑惑可以回复我~
#1

这个名字可以吗 提问者

非常感谢,后两个都成功了。第一个可能是浏览器设置的问题还是不行,尽管已经删了大括号。
2015-08-30 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
JavaScript进阶篇
  • 参与学习       468189    人
  • 解答问题       21891    个

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

进入课程

为什么三个function都没有效果

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信