快捷導(dǎo)航

原生javascript實(shí)現(xiàn)隔行換色

更新時(shí)間：2015年01月04日 10:11:18 投稿：hebedich

這篇文章主要介紹了原生javascript實(shí)現(xiàn)隔行換色,需要的朋友可以參考下

js讓我們一起從基礎(chǔ)來學(xué)習(xí)，我們一點(diǎn)一點(diǎn)的來學(xué)習(xí)

下邊是我寫的代碼，然后大家看著學(xué)習(xí)下吧?。。?/p>

<html>

<head>

<title>js演示</title>

</head>

<body>

<script>

document.write('<table border="1" width="100px" align="center">');

var i=0;

while(i<100){

if(i%10==0){

if(i%20==0)

bg="#cccccc";

else

bg="#ffffff";

document.write('<tr onmouseover="show(this)" onmouseout="onshow(this)" bgcolor="'+bg+'">');

}

document.write('<td>'+i+'</td>');

i++;

if(i%10==0){

document.write("<tr>");

}

}

document.write("</table>")

var ys=null;

function show(obj){

ys=obj.bgColor;

obj.bgColor="red";

}

function onshow(obj){

obj.bgColor=ys;

}

</script>

</body>

</html>

功能很簡單，卻非常實(shí)用，小伙伴們參考下吧。

您可能感興趣的文章:

相關(guān)文章

TypeScript聯(lián)合類型,交叉類型和類型保護(hù)
這篇文章主要介紹了TypeScript聯(lián)合類型,交叉類型和類型保護(hù)，聯(lián)合類型就是定義一些類型，定義的變量只需要滿足任意一種類型即可，交叉類型就是需要滿足所有類型，交叉類型使用，更多內(nèi)容我們來看看下面文章詳細(xì)內(nèi)容吧
2021-12-12
showModelessDialog()使用詳解
showModelessDialog()使用詳解...
2006-09-09
Bootstrap table 定制提示語的加載過程
bootstrap-table是在bootstrap-table的基礎(chǔ)上寫出來的，專門用于顯示數(shù)據(jù)的表格插件。這篇文章主要介紹了Bootstrap table 定制提示語,需要的朋友可以參考下
2017-02-02
Firefox/Chrome/Safari的中可直接使用$/$$函數(shù)進(jìn)行調(diào)試
偶然發(fā)現(xiàn)的，頁面中沒有引入Prototype和jQuery。控制臺中敲$卻發(fā)現(xiàn)是一個(gè)函數(shù)。又試著敲$$，也是個(gè)function
2012-02-02
vue3 uniapp微信登錄功能實(shí)現(xiàn)
根據(jù)最新的微信小程序官方的規(guī)定,uniapp中的uni.getUserInfo方法不再返回用戶頭像和昵稱、以及手機(jī)號,這篇文章主要介紹了vue3 uniapp微信登錄功能實(shí)現(xiàn),需要的朋友可以參考下
2024-04-04
微信小程序功能之全屏滾動(dòng)效果的實(shí)現(xiàn)代碼
最近小編做項(xiàng)目遇到這樣的需求，要求實(shí)現(xiàn)一個(gè)全屏滾動(dòng)的效果，在網(wǎng)上找了實(shí)例代碼，但是不是很完美，小編又結(jié)合自己的知識給大家補(bǔ)充下，對微信小程序全屏滾動(dòng)效果的實(shí)例代碼感興趣的朋友參考下本文吧
2018-11-11
JavaScript數(shù)據(jù)結(jié)構(gòu)之二叉樹的遍歷算法示例
這篇文章主要介紹了JavaScript數(shù)據(jù)結(jié)構(gòu)之二叉樹的遍歷算法,簡單介紹了javascript實(shí)現(xiàn)數(shù)據(jù)結(jié)構(gòu)中二叉樹的中序遍歷、先序遍歷及后序遍歷方法與相關(guān)使用技巧,需要的朋友可以參考下
2017-04-04
bootstrap PrintThis打印插件使用詳解
這篇文章主要為大家詳細(xì)介紹了bootstrap PrintThis打印插件的使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-02-02
JavaScript中的isXX系列是否繼續(xù)使用的分析
我們很容易被漂亮的代碼吸引，也不知不覺的在自己的代碼庫中加入這些。卻沒有冷靜的想過它們的優(yōu)劣。這不，我就收集了一系列形如 “是否為……？” 的判斷的boolean函數(shù)。
2011-04-04
一個(gè)簡單的JavaScript數(shù)據(jù)緩存系統(tǒng)實(shí)現(xiàn)代碼
數(shù)據(jù)緩存系統(tǒng)，主要是將一些可復(fù)用的數(shù)據(jù)臨時(shí)存放一下，放下數(shù)據(jù)后面的再次調(diào)用。
2010-10-10