ホームページ > 記事 > ウェブフロントエンド > JS はテキストをそのまま出力します
今回は、JS でテキストをそのまま出力する場合の注意点について、実際の事例を見てみましょう。
この記事の例では、JavaScript を使用して単語ごとに単純なテキスト印刷効果を実装する方法について説明します。参考のために皆さんと共有してください。詳細は次のとおりです:
まずランニング効果を見てみましょう:
具体的なコードは次のとおりです:
<!DOCTYPE> <html> <head> <title> js打字效果</title> <meta charset="utf-8"> </head> <style type="text/css"> p { 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()> <p id="main"></p> </body> </html>
これを読んだ後、あなたは方法をマスターしたと思います:この記事の事例については、php 中国語 Web サイトのその他の関連記事をご覧ください。
推奨読書:
vuexページが更新された後にデータを保存できない場合の対処方法
以上がJS はテキストをそのまま出力しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。