我不明白为什么这段代码不能运行。我究竟做错了什么？我需要使用 document.write 在 Javascript 中创建我的表。任何帮助将不胜感激!
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
var rows;
var cols;
function table(rows, cols){
document.write('<table border="1">');
for (i=0, i < rows, i++){
document.write('<tr>');
for (j=0, j < cols, j++) {
document.write('<td>' + 'cell' + '</td>');
}
document.write('</tr>');
}
document.write('</table>');
}
document.write (table(2, 4));
</script>
</body>
</html>
最佳答案
好的，现在你已经听够了document.write，引用this关于这个主题。
乍一看你的语法很好，但有两个明显的异常(exception)是在 for 循环中，我们使用分号，因为 for 循环就像是 3 条语句的简写形式以及我们在声明之后的内容，以便浏览器知道您已完成声明声明是 ;。
for(let i=0; i < rows; i++) {...}
另一个明显的错误是你最后调用函数的方式，它应该是:
table(2,4);
以下代码段演示了另一种创建表的方法。代码段中注释的详细信息。
片段
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<!--We don't have to add "type="text/javascript"...
<script> tags anymore-->
<script>
var rows;
var cols;
function createTable(rows, cols) {
/* Using creatElement() method is simple and fast...
|| ...but be mindful that even though you created...
|| ...an element, it's not going to showup until...
|| ...it is added to the DOM.
*/
var table = document.createElement('table');
/* At this point we have a <table> that's...
|| ..."floating around". This is the most...
|| ...advantageous time to add any attributes...
|| ...and other elements. It's costly to add...
|| ...to add to the DOM, so while any element...
|| ...is detached from the DOM (i.e. <table>,)...
|| ...add as much as you are able to before...
|| ...adding it to the DOM.
*/
table.setAttribute('border', '1');
/* for loop = 3 statements + 2 semicolons */
// let ~i~ equal 0;
// while ~i~ is less than ~rows~ continue looping;
// at the end of a loop increment ~i~ by 1;
for (let i = 0; i < rows; i++) {
// Now we have a detached <tr>...
var tRow = document.createElement('tr');
// ...which moves on to an inner loop
for (let j = 0; j < cols; j++) {
// A detached <td>
var tData = document.createElement('td');
// While <td> is detached, let's add text
tData.textContent = 'Cell';
/* appendChild() method will add the <td>...
|| ...to the <tr>. This inner for loop will...
|| ...continue to add <td> to this <tr>...
|| ...as many times the number of ~cols~...
|| ...That was set by this statement:
|| j < cols; and it's perpetuated by this:
|| j++
*/
tRow.appendChild(tData);
}
/* Once the <tr> has completed all of the...
|| inner loops, <tr> is now added to <table>...
|| ...That is one complete loop of the outer
|| ...loop. That's one <tr> filled with <td>...
|| ...This whole cycle will go on until...
|| ...whatever number ~rows~ is.
*/
table.appendChild(tRow);
}
/* After the last outer loop, the <table> is...
|| ...completed and added to the <body> which...
|| ...already is attached to the DOM, thus...
|| ...<table> is in the DOM as well.
*/
document.body.appendChild(table);
}
// Call the function and pass 2 and 4.
createTable(2, 4);
</script>
</body>
</html>关于javascript - 试图让 HTML 表格与 document.write 一起出现在 Javascript 中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41528320/