摘 要：本文主要介紹了Javascript中跑馬燈的實(shí)現(xiàn)機(jī)制，并以此為基礎(chǔ)詳細(xì)介紹了標(biāo)題跑馬燈、狀態(tài)欄跑馬燈、文檔跑馬燈的實(shí)現(xiàn)過(guò)程。

關(guān)鍵詞：跑馬燈 Javascript 函數(shù)

中圖分類號(hào)：TP3 文獻(xiàn)標(biāo)識(shí)碼：A 文章編號(hào)：1672-3791（2012）12（b）-0022-01

1 簡(jiǎn)介

Javascript是Web頁(yè)面中的一種腳本編程語(yǔ)言，也是一種通用的、跨平臺(tái)的、基于對(duì)象和事件驅(qū)動(dòng)并具有安全性的腳本語(yǔ)言。直接嵌入到HTML中，即可得到動(dòng)態(tài)效果，比如，跑馬燈效果就是利用Javascript代碼實(shí)現(xiàn)文字或圖片的無(wú)間斷滾動(dòng)。本文詳細(xì)介紹了跑馬燈的實(shí)現(xiàn)機(jī)制，以及各種跑馬燈效果的實(shí)現(xiàn)過(guò)程。

2 跑馬燈的實(shí)現(xiàn)機(jī)制

跑馬燈，是流傳在寧波一帶的民間表演形式。這里的跑馬燈指在電腦上通過(guò)編程實(shí)現(xiàn)的一種效果，通常指有時(shí)需要用一矩形條顯示少量用戶特別關(guān)心的信息，這條信息串首尾相連，向一個(gè)方向循環(huán)滾動(dòng)。

Javascript跑馬燈的實(shí)現(xiàn)機(jī)制非常簡(jiǎn)單，主要通過(guò)以下三步就可以完成。

（1）要獲取跑馬燈內(nèi)容（文本或圖片），例如msg=“跑馬燈文字的測(cè)試！”。

（2）通過(guò)函數(shù)實(shí)現(xiàn)msg文字的環(huán)形連接msg=msg.substr（1，msg.length-1）+msg.substring（0，1），實(shí)現(xiàn)無(wú)間斷滾動(dòng)。

（3）設(shè)置跑馬燈的位置。

（4）設(shè)置setInterval（“函數(shù)”，500），實(shí)現(xiàn)刷新，setInterval（）方法可按照指定的周期（以毫秒計(jì)）來(lái)調(diào)用函數(shù)，由此可以實(shí)現(xiàn)滾動(dòng)效果。

綜上所述，跑馬燈的實(shí)現(xiàn)代碼為：

將上述代碼嵌入到標(biāo)簽之間，然后在標(biāo)簽中加入屬性onload=”showText（）”，即可得到Javascript跑馬燈效果。

3 文字跑馬燈實(shí)現(xiàn)

跑馬燈根據(jù)實(shí)現(xiàn)位置的不同可分為標(biāo)題欄跑馬燈、狀態(tài)欄跑馬燈、文檔跑馬燈，下面就具體介紹以上三種跑馬燈效果的實(shí)現(xiàn)。

（1）標(biāo)題欄跑馬燈。

標(biāo)題欄跑馬燈，即實(shí)現(xiàn)頁(yè)面標(biāo)題內(nèi)容的無(wú)間斷滾動(dòng)。具體實(shí)現(xiàn)代碼為：

script language="javascript">

msg=document.title；//獲取頁(yè)面標(biāo)題

function showText（）{

msg=msg.substr（1，msg.length-1）+msg.substring（0，1）；

document.title=msg；//設(shè)置頁(yè)面標(biāo)題

}

setInterval（"showText（）"，500）；

（2）狀態(tài)欄跑馬燈。

狀態(tài)欄跑馬燈，即在windows狀態(tài)欄上實(shí)現(xiàn)文字的不間斷滾動(dòng)效果，實(shí)現(xiàn)代碼為：

（3）文檔跑馬燈。

文檔跑馬燈，即在文檔的任意位置顯示跑馬燈效果。實(shí)現(xiàn)這一效果，最重要的就是如何獲取實(shí)現(xiàn)跑馬燈的文檔位置。我們可以借助

①在文檔中定義跑馬燈區(qū)域：

②編寫跑馬燈函數(shù)，可以通過(guò)document對(duì)象的getElementById（）方法得到文檔對(duì)象，然后調(diào)用document對(duì)象的innerHTML屬性往文檔內(nèi)寫入跑馬燈顯示文字。

function showText（）{

var msg="跑馬燈文字的測(cè)試！"

msg=msg.substr（1，msg.length-1）+msg.substring（0，1）；

var obD=document.getElementById（"d1"）；

obD.innerHTML=msg；

}

setInterval（"showText（）"，500）；

③加載javascript

在標(biāo)簽中通過(guò)onload 屬性加載函數(shù)，例如。

4 結(jié)語(yǔ)

Javascript腳本語(yǔ)言是一種使用靈活的語(yǔ)言，跑馬燈效果是網(wǎng)頁(yè)中常用的一種顯示效果。實(shí)現(xiàn)機(jī)制并不復(fù)雜，在實(shí)現(xiàn)過(guò)程中主要有兩個(gè)問(wèn)題，一是跑馬燈的位置確定；二是跑馬燈循環(huán)的實(shí)現(xiàn)，本文主要對(duì)以上兩個(gè)問(wèn)題進(jìn)行了論述。

參考文獻(xiàn)

[1] 曾海.JavaScript程序設(shè)計(jì)基礎(chǔ)教程[M].人民郵電出版社，2009.

[2] 劉睿.跑馬燈使用大全[J].網(wǎng)絡(luò)與信息，2010.

[3] 張惠芬.Javascript理論分析及其應(yīng)用[J].衡水學(xué)院學(xué)報(bào)，2006.

[4] 周林，步豐林.嵌入式瀏覽器中Javas cript和DOM的支持[J].計(jì)算機(jī)工程，2004.