JavaScript實現九九乘法表


每個學過編程的人都寫過“HelloWorld”

但99乘法表,我想也應該成為每個編程初學者的必編程序

這是JavaScript的實現方法,非常適合初學者!!!

以下是代碼及注釋

 

 1 <!DOCTYPE html>  
 2 <head>  
 3 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />  
 4 <title>JavaScript九九乘法表</title>  
 5   
 6 <style type="text/css">  
 7 table{  
 8     width:600px;         //表格height屬性可設置可不設置,建議不設置
 9     border-collapse:separate;
10     } 
11 table td{  
12     border:#000000 1px solid;
13     text-align: center;    //使<td>標簽中的內容居中顯示,若是<th>標簽,沒有此行代碼亦可自動居中
14     }  
15 </style>
16 
17 </head>  
18 <body>  
19   
20 <script type="text/javascript">  
21 //下面部分是核心代碼
22   
23 document.write("<table>");      //<table></table>添加一個表格樣式來顯示乘法表 
24 for (var x = 1; x <= 9; x++)  
25 {  
26     document.write("<tr>");     //<tr></tr>標簽
27     for (var y = 1; y <= x; y++)
28     {  
29         document.write("<td>"+y+"x"+x+"="+y*x+"</td>");//亦可用<th>標簽來起到居中加粗內容的作用
30     }                                                    
31     document.write("</tr>");  
32 }  
33 document.write("</table>");    
34 </script> 
35  
36 </body>  
37 </html>

 

 

下面是上面代碼中涉及的一些內容

  • <table>標簽是定義一個表格!

  <tr> - 定義表行
  <th> - 定義表頭
  <td> - 定義表元(表格的具體數據)
  border=""屬性可以設置表格的邊框!
  <th>里的字默認為加粗居中顯示!
  bgcolor=""也就是我熟悉的設置表格背景顏色!

  • cellspacing=""和cellspadding=""是設置表格間的間距和單元格里的間距!但這兩個標簽都被HTML5移除了,取而代之的是border-collapse:separate | collapse | inherit。
separate 默認值。邊框會被分開。不會忽略border-spacing 和 empty-cells 屬性。
collapse 如果可能,邊框會合並為一個單一的邊框。會忽略border-spacing 和 empty-cells 屬性。
inherit 規定應該從父元素繼承border-collapse屬性的值。

 

 

 原文:http://www.cnblogs.com/Loonger/p/4862342.html


免責聲明!

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



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