为什么用setAttribute添加不能成功?

来源:9-22 编程练习

weixin_慕粉117217

2019-03-07 11:09

<!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++){

       tr[i].setAttribute("onmouseover","javascript:this.style.backgroundColor='#f2f2f2'");

          tr[i].setAttribute("onmouseout","javascript:this.style.backgroundColor='#fff'")

  }   

}

     

      // 编写一个函数,供添加按钮调用,动态在表格的最后一行添加子节点;

     function add(){

     //获取table节点,添加他的子节点,从而添加新的一行

var table=document.getElementsByTagName("table");

var tr=document.createElement("tr");

var tra=document.createAttribute("td","xh003");

var trb=document.createAttribute("td","王欣");

var trc=document.createElement("td");

trc.innerHTML="<a href='' onclick='removed(this)'>删除</a>";

table[0].appendChild(tr);

tr.appendChild(tra);

tr.appendChild(trb);

tr.appendChild(trc);

     

  

}  

   

     

     // 创建删除函数

     

  </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:dis;" >删除</a></td>   <!--在删除按钮上添加点击事件  -->

  </tr>


  <tr>

<td>xh002</td>

<td>刘小芳</td>

<td><a href="javascript:;" >删除</a></td>   <!--在删除按钮上添加点击事件  -->

  </tr>  


  </table>

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

 </body>

</html>


写回答 关注

1回答

  • 瑞吉自闭了
    2019-03-17 10:01:01

    是可以的,在自己的浏览器调试一下。

JavaScript进阶篇

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

468060 学习 · 21891 问题

查看课程

相似问题