欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

簡(jiǎn)單的js表格操作

 更新時(shí)間：2016年09月24日 11:52:42   作者：湘湘_Saling  
這篇文章主要為大家詳細(xì)介紹了簡(jiǎn)單的js表格操作,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

效果圖：

 

任務(wù)：

 1. 鼠標(biāo)移到不同行上時(shí)背景色改為色值為 #f2f2f2，移開(kāi)鼠標(biāo)時(shí)則恢復(fù)為原背景色 #fff 

var tr=document.getElementsByTagName("tr");
 for(var i= 0;i<tr.length;i++)
 {
 bgcChange(tr[i]);
 }
 // 鼠標(biāo)移動(dòng)改變背景,可以通過(guò)給每行綁定鼠標(biāo)移上事件和鼠標(biāo)移除事件來(lái)改變所在行背景色。
function bgcChange(obj)
 {
 obj.onmouseover=function(){
 obj.style.backgroundColor="#f2f2f2";
 }
 obj.onmouseout=function(){
 obj.style.backgroundColor="#fff";
 }
 }

2. 點(diǎn)擊添加按鈕，能動(dòng)態(tài)在最后添加一行 

var num=2;
 function add(){
 num++;
 var tr=document.createElement("tr");
 var xh=document.createElement("td");
 var xm=document.createElement("td");
 xh.innerHTML="xh00"+num;
 xm.innerHTML="第"+num+"位學(xué)生";
var del=document.createElement("td");
 del.innerHTML="<a href='javascript:;' onclick='del(this)' >刪除</a>";
 var tab=document.getElementById("table");
 tab.appendChild(tr);
 tr.appendChild(xh);
 tr.appendChild(xm);
 tr.appendChild(del);
 var tr = document.getElementsByTagName("tr");
 for(var i= 0;i<tr.length;i++)
 {
 bgcChange(tr[i]);
 }
 }

 3. 點(diǎn)擊刪除按鈕，則刪除當(dāng)前行 

function del(obj)
 {
 var tr=obj.parentNode.parentNode;
 tr.parentNode.removeChild(tr);
 }

 以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論