本文實例講述了JavaScript實現簡單的文本逐字打印效果。分享給大家供大家參考,具體如下:
先來看看運行效果:
具體代碼如下:
<!DOCTYPE><html><head><title>www.49028c.com js打字效果</title><meta charset="utf-8"></head><style type="text/css">div { width:980px; margin:10px auto; background:#F3E6EA; border:2px outset #f9c6aa; color:green;}</style><script type="text/javascript">var i=1;function write(){ var id=document.getElementById("main"); var msg="JS打字機效果 ,原理很簡單:每次多獲取一個待打出的字符串的值,輸出,覆蓋原來輸出的內容即可JS打字機效果 ,原理很簡單:每次多獲取一個待打出的字符串的值,輸出,覆蓋原來輸出的內容即可JS打字機效果 ,原理很簡單:每次多獲取一個待打出的字符串的值,輸出,覆蓋原來輸出的內容即可JS打字機效果 ,原理很簡單:每次多獲取一個待打出的字符串的值,輸出,覆蓋原來輸出的內容即可JS打字機效果 ,原理很簡單:每次多獲取一個待打出的字符串的值,輸出,覆蓋原來輸出的內容即可JS打字機效果 ,原理很簡單:每次多獲取一個待打出的字符串的值,輸出,覆蓋原來輸出的內容即可JS打字機效果 ,原理很簡單:每次多獲取一個待打出的字符串的值,輸出,覆蓋原來輸出的內容即可JS打字機效果 ,原理很簡單:每次多獲取一個待打出的字符串的值,輸出,覆蓋原來輸出的內容即可JS打字機效果 ,原理很簡單:每次多獲取一個待打出的字符串的值,輸出,覆蓋原來輸出的內容即可"; var len=msg.length; var msg1=msg.substring(0,i); id.innerHTML=msg1; if(i==len){clearInterval(t)} else i++;}function time1(){ var t=setInterval(function(){write()},50);}</script><body onload=time1()><div id="main"></div></body></html>
更多關于JavaScript相關內容感興趣的讀者可查看本站專題:《JavaScript運動效果與技巧匯總》、《JavaScript切換特效與技巧總結》、《JavaScript查找算法技巧總結》、《JavaScript動畫特效與技巧匯總》、《JavaScript錯誤與調試技巧總結》、《JavaScript數據結構與算法技巧總結》、《JavaScript遍歷算法與技巧總結》及《JavaScript數學運算用法總結》
希望本文所述對大家JavaScript程序設計有所幫助。
新聞熱點
疑難解答