快捷導(dǎo)航

鼠標(biāo)經(jīng)過tr時(shí),改變tr當(dāng)前背景顏色

更新時(shí)間：2014年01月13日 10:11:04 作者：

本篇文章主要介紹了鼠標(biāo)經(jīng)過tr時(shí),改變tr當(dāng)前背景顏色的示例代碼，需要的朋友可以過來參考下，希望對(duì)大家有所幫助

示例如下：

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>鼠標(biāo)經(jīng)過給tr換顏色</title>    
</head>
<body>
<table align="center" width="100%" border="1" cellspacing="1" cellpadding="1" >
  <tr style="cursor:hand " onmousemove="changeTrColor(this)">
    <td align="center">1</td>
    <td height="20">&nbsp;123</td>
    <td height="20">&nbsp;abvx</td>
    <td height="20">&nbsp;465465</td>
    <td height="20">546654654</td>
  </tr>
  <tr style="cursor:hand " onmousemove="changeTrColor(this)">
    <td align="center">1</td>
    <td height="20">&nbsp;123</td>
    <td height="20">&nbsp;abvx</td>
    <td height="20">&nbsp;465465</td>
    <td height="20">546654654</td>
  </tr>    
  <tr style="cursor:hand " onmousemove="changeTrColor(this)">
    <td align="center">1</td>
    <td height="20">&nbsp;123</td>
    <td height="20">&nbsp;abvx</td>
    <td height="20">&nbsp;465465</td>
    <td height="20">546654654</td>
  </tr>
</table>
<script type="text/javascript">
function changeTrColor(obj){    
    var _table=obj.parentNode;
    for (var i=0;i<_table.rows.length;i++){
        _table.rows[i].style.backgroundColor="";
    }    
    obj.style.backgroundColor="blue";
}
</script>
</form>
</body>
</html>

您可能感興趣的文章:

相關(guān)文章

使用cropper.js裁剪頭像的實(shí)例代碼
最近小編在做一個(gè)裁剪頭像的功能，下面小編把使用cropper.js裁剪頭像的實(shí)例代碼分享到腳本之家平臺(tái)，需要朋友參考下吧
2017-09-09
用js動(dòng)態(tài)添加html元素,以及屬性的簡單實(shí)例
下面小編就為大家?guī)硪黄胘s動(dòng)態(tài)添加html元素,以及屬性的簡單實(shí)例。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2016-07-07
javascript 動(dòng)態(tài)加載 css 方法總結(jié)
有時(shí)候我們在設(shè)計(jì)網(wǎng)頁的時(shí)候想動(dòng)態(tài)的加載css文件,并不是將css文件寫死在頁面中,這時(shí)就可以使用下面方法.
2009-07-07
js實(shí)現(xiàn)數(shù)組轉(zhuǎn)樹示例
這篇文章主要為大家介紹了js實(shí)現(xiàn)數(shù)組轉(zhuǎn)樹示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2022-06-06
webpack4 optimization使用總結(jié)
這篇文章主要介紹了webpack4 optimization使用總結(jié)，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-11-11
javascript中JSON.parse()與eval()解析json的區(qū)別
這篇文章主要介紹了javascript中JSON.parse()與eval()解析json的區(qū)別,詳細(xì)描述了json格式數(shù)據(jù)的操作技巧,并結(jié)合實(shí)例形式對(duì)比分析了使用JSON.parse()與eval()解析json的區(qū)別,需要的朋友可以參考下
2016-05-05
使用canvas及js簡單生成驗(yàn)證碼方法
在很多時(shí)候都需要用到驗(yàn)證碼，前端驗(yàn)證碼需要知道Html5中的canvas知識(shí)點(diǎn)。驗(yàn)證碼生成步驟是：1.生成一張畫布canvas 2.生成隨機(jī)數(shù)驗(yàn)證碼 3.在畫布中生成干擾線 4.把驗(yàn)證碼文本填充到畫布中 5.點(diǎn)擊畫布更換驗(yàn)證碼
2017-04-04
Bootstrap網(wǎng)格系統(tǒng)詳解
bootstrap框架中的網(wǎng)格系統(tǒng)就是將容器平分成12份，在使用的時(shí)候可以根據(jù)實(shí)際情況重新編譯LESS/SASS源碼來修改12這個(gè)數(shù)值。接下來通過本文給大家介紹Bootstrap網(wǎng)格系統(tǒng)，感興趣的朋友一起學(xué)習(xí)
2016-04-04
javascript設(shè)計(jì)模式之Adapter模式【適配器模式】實(shí)現(xiàn)方法示例
這篇文章主要介紹了javascript設(shè)計(jì)模式之Adapter模式,結(jié)合實(shí)例形式分析了JS適配器模式的原理與具體實(shí)現(xiàn)方法,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2017-01-01
js實(shí)現(xiàn)電燈開關(guān)效果
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)電燈開關(guān)效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-01-01