JavaScript中4種document.write()輸出展示


document.write() 可用於直接向 HTML 輸出流寫內容,簡單的說就是直接在網頁中輸出內容。

第一種:輸出內容用""括起,直接輸出""號內的內容,補充:如果是數字,有無""均可;如果是漢字與字母必須添加

1 <script type="text/javascript">
2   document.write("I love JavaScript!"); //內容用""括起來,""里的內容直接輸出。
3 </script>
1 <script type="text/javascript">
2 //document.write(1 2 3)
3 /*
4 document.write()輸出內容,如果是數字就不要添加""不過要是這樣的話,你輸出的數字中有空格,就報錯了,所以糾正下,還是老老實實寫上這個""
5 */
6 </script> 

第二種:通過變量,輸出內容

1 <script type="text/javascript">
2   var mystr="hello world!";
3   document.write(mystr);  //直接寫變量名,輸出變量存儲的內容。
4 </script>

第三種:輸出多項內容,內容之間用+號連接

1 <script type="text/javascript">
2   var mystr="hello";
3   document.write(mystr+"I love JavaScript"); //多項內容之間用+號連接
4 </script>

第四種:輸出HTML標簽,並起作用,標簽使用""括起來

1 <script type="text/javascript">
2   var mystr="hello";
3 document.write(mystr+"<br>");//輸出hello后,輸出一個換行符
4   document.write("JavaScript");
5 </script>

 完整代碼展示:

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title>JavaScript-輸出內容(document.write)</title>
 6         <script type="text/javascript">
 7         //第一種
 8         document.write("說什么好了,糾結,那就不說了")
 9         //第二種
10         var sky="i love javascript"
11         document.write(sky);
12         //第三種
13         var mystr="hello";
14         document.write(mystr+123+"girl妹子");
15         //第四種
16         var boy="95 boy";
17         document.write("<br/>"+""+2020+""+boy+"&nbsp;"+"prefect javascript")
18         </script>
19     </head>
20     <body>
21 <!--         <form action="" method="">
22             <input type="button" name="" id="" value="點我" onclick="hs()"/>
23         </form>
24         <script type="text/javascript">
25             function hs(){
26                 alert("調用函數");
27             }
28             hs();
29         </script> -->
30     </body>
31 </html>

||知識拓展:js中如何輸出空格

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title>js中如何輸出空格</title>
 6         <script type="text/javascript">
 7            document.write("1  2  3");
 8            /*
 9            無論在輸出的內容中什么位置有多少個空格,顯示的結果好像只有一個空格。
10            這是因為瀏覽器顯示機制,對手動敲入的空格,將連續多個空格顯示成1個空格。
11            */
12           //解決辦法一:使用輸出html標簽&nbsp;來解決,這里讓我想到html的文本空格
13           document.write("<br/>"+"1"+"&nbsp;&nbsp;&nbsp;&nbsp;"+"2 3");
14           //解決辦法二:使用CSS樣式來解決, 注意在輸出時添加“white-space:pre;”樣式屬性,這個樣式表示"空白會被瀏覽器保留"
15            document.write("<p style='white-space: pre;'>"+"1         2   3"+"</p>");
16            document.write("<p style='letter-spacing: 20px;'>"+"123"+"</p>");
17            document.write("<p style='word-spacing:20px;'>"+"who care about you 'Your pressure comes from'"+"b"+"c"+"</p>");
18         </script>
19     </head>
20     <body>
21     </body>
22 </html>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM