obj和this是什么关系啊，好迷，为什么//创建删除函数那里得到ID的最后要加lastChild

obj和this是什么关系啊，好迷，为什么//创建删除函数那里得到ID的最后要加lastChild

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

HighLight();

}

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

function HighLight(){

var tbody=document.getElementById("table");

trs=tbody.getElementsByTagName("tr");

for(var i=1; i<trs.length; i++){

trs[i].onmouseover=function(){

this.style.backgroundColor="#959851";

}

trs[i].onmouseout=function(){

this.style.backgroundColor="#fff";

}

}

}

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

function addOne(obj){

var tbody=document.getElementById("table").lastChild;

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

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

td.innerHTML="<input type'text'>";

tr.appendChild(td);

td=document.createElement("td");

td.innerHTML="<input type'text'>";

tr.appendChild(td);

td=document.createElement("td");

td.innerHTML="<a href='javascript:;' OnClick='deleteRow(this)'>删除</a>";

tr.appendChild(td);

tbody.appendChild(tr);

HighLight();

}

// 创建删除函数

function deleteRow(obj){

var tbody=document.getElementById("table").lastChild;

var tr=obj.parentNode.parentNode;

tbody.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='deleteRow(this)'>删除</a></td>

</tr>

<tr>

<td>xh002</td>

<td>刘小芳</td>

<td><a href="javascript:;" OnClick='deleteRow(this)'>删除</a></td>

</tr>

</table>

<input type="button" value="添加一行" OnClick="addOne()" />

</body>

</html>

尼古拉车夫

浏览 1169回答 1

1回答

李晓健

这个this 通俗并不准确的说，就是谁调用这个方法，这个方法里面的this就是谁比喻trs[i].onmouseover=function(){ this.style.backgroundColor="#959851"; } // 这里是trs[i]调用的onmouseover，所以这个方法里的 this就是 trs[i]第二个问题其实teble的格式是这样的<table> <tbody> <tr> <td></td> </tr> </tbody> </table>这里不包括thead, 这个tbody就算你没有写，浏览器会自己加上的，tbody=document.getElementById("table").lastChild; 得到的就是这个tbody

1

0

随时随地看视频慕课网APP

相关分类

JavaScript