| 編程(Programming)是編定程序的中文簡(jiǎn)稱,就是讓計(jì)算機(jī)代碼解決某個(gè)問(wèn)題,對(duì)某個(gè)計(jì)算體系規(guī)定一定的運(yùn)算方式,使計(jì)算體系按照該計(jì)算方式運(yùn)行,并最終得到相應(yīng)結(jié)果的過(guò)程。為了使計(jì)算機(jī)能夠理解(understand)人的意圖,人類就必須將需解決的問(wèn)題的思路、方法和手段通過(guò)計(jì)算機(jī)能夠理解的形式告訴計(jì)算機(jī),使得計(jì)算機(jī)能夠根據(jù)人的指令一步一步去工作,完成某種特定的任務(wù)。這種人和計(jì)算體系之間交流的過(guò)程就是編程。 【實(shí)例名稱】 JS代碼實(shí)現(xiàn)文字逐個(gè)閃亮(霓虹燈效果) 【實(shí)例描述】 常見(jiàn)的霓虹燈效果,是通過(guò)文字逐個(gè)循環(huán)顯示實(shí)現(xiàn)。本例通過(guò)文本的顏色變換,實(shí)現(xiàn)文字的霓虹燈效果。 【實(shí)例代碼】 <html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>標(biāo)題頁(yè)</title>
<script language="JavaScript">
text = "歡迎光臨我們的俱樂(lè)部"; //顯示的文字
color1 = "gray"; //文字的顏色
color2 = "blue"; //轉(zhuǎn)換的顏色
fontsize = "6"; //字體大小
speed = 100; //轉(zhuǎn)換速度 (毫秒)
i = 0;
if (navigator.appName == "Netscape") {//瀏覽器不同,輸出的標(biāo)簽不同
document.write("<layer id=myDiv visibility=show></layer><br><br><br>");
}
else {
document.write("<div id=myDiv></div>");
}
function changeCharColor()
{
if (navigator.appName == "Netscape") { //Netscape瀏覽器的情況下
document.myDiv.document.write("<center><font face=arial size =" + fontsize + "><font color=" + color1 + ">");
for (var j = 0; j < text.length; j++) {
if(j == i) {
document.myDiv.document.write("<font face=arial color=" + color2 + ">" + Text.charAt(i) + "</font>");
}
else {
document.myDiv.document.write(text.charAt(j));
}
}
document.myDiv.document.write('</font></font></center>');
document.myDiv.document.close();
}
if (navigator.appName == "Microsoft Internet Explorer") //IE瀏覽器的情況下
{
str = "<center><font face=arial size=" + fontsize + "><font color=" + color1 + ">";
for (var j = 0; j < text.length; j++) { //循環(huán)輸出指定字體大小和顏色的文本
if( j == i) {
str += "<font face=arial color=" + color2 + ">" + text.charAt(i) + "</font>";
}
else {
str += text.charAt(j);
}
}
str += "</font></font></center>";
myDiv.innerHTML = str; //在div中顯示文本
}
(i == text.length) ? i=0 : i++; //如果i的值不大于文本的長(zhǎng)度,則自增
}
setInterval("changeCharColor()", speed); //通過(guò)定時(shí)器,實(shí)現(xiàn)不斷的循環(huán)
</script>
</head>
<body>
</body>
</html>
【運(yùn)行效果】  【難點(diǎn)剖析】 本例的重點(diǎn)是霓虹燈效果的原理,霓虹燈就是逐個(gè)點(diǎn)亮一段文字。本例中通過(guò)循環(huán)獲取當(dāng)前要點(diǎn)亮的字符,然后跟據(jù)指定的顏色和字體大小,設(shè)置此字符的樣式,本例中用顏色變化代表點(diǎn)亮某個(gè)字符。修改后的文本再用div動(dòng)態(tài)輸出,以實(shí)現(xiàn)文本的動(dòng)態(tài)改變效果。 【源碼下載】 本實(shí)例JS代碼下載
使用編程語(yǔ)言寫(xiě)的程序,由于每條指令都對(duì)應(yīng)計(jì)算機(jī)一個(gè)特定的基本動(dòng)作,所以程序占用內(nèi)存少、執(zhí)行效率高。 |
溫馨提示:喜歡本站的話,請(qǐng)收藏一下本站!