add is not defined

来源:9-22 编程练习

qq_美丽的曲线_03762593

2019-02-19 09:27

<!DOCTYPE html>

<html>


<head>

<meta charset="UTF-8">

<title></title>

</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="remove(this)">删除</a>

</td>

<!--在删除按钮上添加点击事件  -->

</tr>


<tr>

<td>xh002</td>

<td>刘小芳</td>

<td>

<a href="javascript:;" onclick="remove(this)">删除</a>

</td>

<!--在删除按钮上添加点击事件  -->

</tr>


</table>

<input type="button" value="添加一行" onclick="add()"/>

<!--在添加按钮上添加点击事件  -->

</body>


</html>

<script type="text/javascript">

window.onload = function() {


// 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。


var trlist = document.getElementsByTagName('tr');

for(var i = 0; i < trlist.length; i++) {

overobj(trlist[i])

}


function overobj(obj) {

obj.onmouseover = function() {

obj.style.backgroundColor = "#f2f2f2";

}

obj.onmouseout = function() {

obj.style.backgroundColor = "#fff";

}

}


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

var num = 2


function add() {

num++

var tab = document.getElementById('table');

//  var tbodys = tab.childNodes[1];

//  console.log(tbodys);

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

var td1 = document.createElement('td');

var td2 = document.createElement('td');

var td3 = document.createElement('td');

var a = document.createElement('a');

a.href = "javascript:;";

td1.innerHTML = "xh00" + num;

td2.innerHTML = "笑话" + num;

a.innerHTML = "删除";

a.setAttribute('onclick', 'remove(this)')

//  var tdtext = document.createTextNode('xh003');

//  td.appendChild(tdtext);

tab.appendChild(tr);

tr.appendChild(td1);

tr.appendChild(td2);

tr.appendChild(td3);

td3.appendChild(a);


var trlist = document.getElementsByTagName('tr');

//  console.log(trlist);

for(var i = 0; i < trlist.length; i++) {

overobj(trlist[i]);

console.log(trlist[i]);

}


}


// 创建删除函数


function remove(obj) {

var tr = obj.parentNode.parentNode.parentNode;

console.log(tr);

tr.parentNode.removeChild(tr);


}

}

</script>

请问一下,我这哪写错了啊?add  remove这两个都报错

写回答 关注

2回答

  • 热爱生活_热爱编程
    2019-02-27 11:12:25

    话说为什么window.onload去掉就行了,window.onload和调用函数不冲突吧

  • qq_美丽的曲线_03762593
    2019-02-19 09:39:31

    可以了,感谢各位,window.onload去掉就好了

JavaScript进阶篇

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

468060 学习 · 21891 问题

查看课程

相似问题