在Javascript中使用for循環創建表格

我想在使用Javascript的html文檔中創建一個簡單的時間表。這是到目前爲止我的代碼：在Javascript中使用for循環創建表格

<!DOCTYPE> 
    <html> 
    <head> 
     <title>Table</title> 
    </head> 
    <body> 
    <script language="javascript" type="text/javascript"> 
     for (var a=0; a < 10; a++) { 
      document.write("<tr>"); 
      for(var b=0; b<10; b++) { 
       document.write("<td>"a*b"</td>"); 
     } 
     document.write("</tr>"); 
     } 
    </script> 
    </body> 
    </html>

我通過張貼的問題看，但找不到答案，可能是因爲我是一個初學編程的，不明白大部分。

來源

2014-02-26 user3294625

'document.write（「」+（a * b）+「」）;'？ – thefourtheye

事實上，你必須使用'+'號正確連接你的字符串。 – g00glen00b

好了，首先你要插入TR（行）和TD（細胞）到表元素...像

document.write("<table>"); 
// your loop here 
document.write("</table>");

有更好的方法來做到這一點，雖然！

來源

2014-02-26 13:04:00 Luca

感謝您的幫助，它完美運作。 – user3294625

很高興工作！ :)你介意將答案標記爲正確的答案嗎？對我來說這意味着很多，謝謝:) – Luca

使用'+'來拼接。

<!DOCTYPE> 
<html> 
<head> 
<title>Table</title> 
</head> 
<body> 
<script language="javascript" type="text/javascript"> 
for (var a=0; a < 10; a++) { 
document.write("<tr>"); 
for(var b=0; b<10; b++) { 
document.write("<td>"+(a*b)+"</td>"); 
} 
document.write("</tr>"); 
} 
</script> 
</body> 
</html>

來源

2014-02-26 13:00:52

-1

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<script> 
 
function calc(arg1,arg2) 
 
{ 
 
\t \t var multi = (arg1 * arg2); 
 
\t \t return multi; \t 
 
} 
 
</script> 
 
</head> 
 
<body> 
 
<table border="solid 2px;" style="color:black;font-size:50px;"> 
 
\t <thead><tr> 
 
\t \t \t <script> 
 
\t \t \t for(var j=1; j<=10; j++) 
 
\t \t \t { 
 
\t \t \t \t document.write("<th>"+i+"</th>"); 
 
\t \t \t } 
 
\t \t \t </script> 
 
\t \t \t </tr> 
 
\t </thead> 
 
\t <tbody> 
 
<script> 
 
for(var i =1; i<=10; i++) 
 
{ 
 
\t document.write("<tr>"); 
 
\t for(var k=1; k<=10; k++) 
 
\t \t { 
 
\t \t \t var arg1 = i; 
 
\t \t \t var arg2 = k; 
 
\t \t \t document.write("<td>"+calc(arg1,arg2)+"</td>"); \t 
 
\t \t } 
 
\t document.write("</tr>"); 
 
} \t 
 
</script> 
 
\t </tbody> 
 
</table> 
 
</body> 
 
</html>

來源

2015-08-31 18:00:59

<!Doctype html> 
 
<html> 
 
<head> 
 
<script type="text/javascript"> 
 
function table() 
 
{ 
 
\t this.calcmul = calc; 
 
} 
 
function calc(arg1,arg2) 
 
{ 
 
\t \t var multi = (arg1 * arg2); 
 
\t \t return multi; \t 
 
} 
 
var table2 = new table(); 
 
</script> 
 
</head> 
 
<body> 
 
<table border="solid 2px;" style="font-size:50px;"> 
 
\t <thead><tr> 
 
\t \t \t <script> 
 
\t \t \t for(var j=1; j<=10; j++) 
 
\t \t \t { 
 
\t \t \t \t document.write("<th><label style='color:red;'>"+i+"</label></th>"); 
 
\t \t \t } 
 
\t \t \t </script> 
 
\t \t \t </tr> 
 
\t </thead> 
 
\t <tbody> 
 
\t \t <script type="text/javascript"> \t 
 
for(var i =1; i<=10; i++) 
 
{ 
 
\t document.write("<tr>"); 
 
\t for(var k=1; k<=10; k++) 
 
\t \t { 
 
\t \t \t var arg1 = i; 
 
\t \t \t var arg2 = k; 
 
\t \t \t document.write("<td>"+table2.calcmul(arg1,arg2)+"</td>"); \t 
 
\t \t } 
 
\t document.write("</tr>"); 
 
} \t 
 
</script> 
 
\t </tbody> 
 
</table> 
 
</body> 
 
</html>

來源

2015-08-31 18:04:30

-1

<div id="yr" class="year"></div> 
function year(){ 
    var test = '<table border="1px"><thead><tr><th><</th><th colspan="2">2015-2016</th><th>></th><tr></thead><tbody>'; 
    var tr=''; 
    for(var i=0;i<4;i++){ 
     tr += '<tr>'; 
     for(var j=0;j<4;j++){ 
      tr += '<td>'+2015+'</td>'; 
      } 
     } 
     tr +='</tr>'; 
    test += tr; 
    return document.getElementById('yr').innerHTML = test; 
} 
year();

來源

2016-02-16 11:05:55 vijay

請參閱http://jsfiddle.net/wmkNe/132/ – vijay

請提供您的代碼的正確解釋。 – Noy

固定的行和列 – vijay

-1

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<script> 
 
function calc(arg1,arg2) 
 
{ 
 
\t \t var multi = (arg1 * arg2); 
 
\t \t return multi; \t 
 
} 
 
</script> 
 
</head> 
 
<body> 
 
<table border="solid 2px;" style="color:black;font-size:50px;"> 
 
\t <thead><tr> 
 
\t \t \t <script> 
 
\t \t \t for(var j=1; j<=10; j++) 
 
\t \t \t { 
 
\t \t \t \t document.write("<th>"+i+"</th>"); 
 
\t \t \t } 
 
\t \t \t </script> 
 
\t \t \t </tr> 
 
\t </thead> 
 
\t <tbody> 
 
<script> 
 
for(var i =1; i<=10; i++) 
 
{ 
 
\t document.write("<tr>"); 
 
\t for(var k=1; k<=10; k++) 
 
\t \t { 
 
\t \t \t var arg1 = i; 
 
\t \t \t var arg2 = k; 
 
\t \t \t document.write("<td>"+calc(arg1,arg2)+"</td>"); \t 
 
\t \t } 
 
\t document.write("</tr>"); 
 
} \t 
 
</script> 
 
\t </tbody> 
 
</table> 
 
</body> 
 
</html>

來源

2017-10-13 10:12:36 harika

在Javascript中使用for循環創建表格

回答

相關問題