javascript编程练习

来源：互联网发布：c语言输入英文名编辑：程序博客网时间：2024/06/06 12:31

new document

  window.onload = function()  {    var tr=document.getElementsByTagName("tr");    for(i=0;i<tr.length;i++)    {     bgcChang(tr[i]);    } } function bgcChange(obj) //鼠标划过效果与鼠标离开效果函数 {     obj.onmouseover=function()     {         obj.style.backgroundColor="#f2f2f2";    }         obj.onmouseout=function()    {             obj.style.backgroundColor="#fff"}     } var num=2;       function add() //添加一行列表函数 {     num++;     var tr=document.createElement("tr");     var xd=document.createElement("td");     var xdd=document.createElement("td");     xd.innerHTML="XD00"+num;     xdd.innerHTML="第"+num+"学生";     var del=document.createElement("td");     del.innerHTML="<a href='javascript:;' onclick='del(this)'>删除</a>";     var xt=document.getElementById("table");     xt.appendChild(tr);     tr.appendChild(xd);     tr.appendChild(xdd);     tr.appendChild(del);     var tr=document.getElementsByTagName("tr");     for(i=0;i<tr.length;i++)     {         bgcChange(tr[i]);     } } function del(obj) //删除当前行函数 {     var tr=obj.parentNode.parentNode;     tr.parentNode.removeChild(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()"  />   <!--在添加按钮上添加点击事件  -->

学号姓名操作

知识点：
1、onmouseover=”函数” 鼠标划过效果，效果由函数决定
2、onmouseout =”函数” 鼠标划走的效果，效果也是由函数来决定
3、removeChild（指定标签）删除标签下指定子标签
4、createElement(“标签名”) 创建一个元素通常和appendNode一起使用
5、appendNode 默认是插入添加到最后一个子节点后

0 0