试图让HTML表格与Javascript中的document.write一起出现

Question

I can't figure out why this code is not working out. 我不知道为什么这段代码无法解决。 What am I doing wrong? 我究竟做错了什么？ I need to use document.write to create my table in Javascript. 我需要使用document.write在Javascript中创建表。 Any help would be appreciated! 任何帮助，将不胜感激！

<!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>

Answer 1

Ok, by now you got an ear full of document.write , refer to this about the subject. 好了，现在你得到了一个耳朵充满了document.write ，请参阅此有关的主题。

At a glance your syntax is good with two glaring exceptions is that in a for loop, we use semicolons because a for loop is like a shorthand form of 3 statements and what we have after a statement so browsers know you are finished stating a statement is a ; 乍一看，您的语法有两个明显的例外是好的，因为在for循环中，我们使用分号，因为for循环就像3条语句的简写形式，而语句之后的内容使浏览器知道您已经完成了声明一个; . 。

 for(let i=0; i < rows; i++) {...}

The other glaring error is how you are calling the function at the end, it should be: 另一个明显的错误是您最后如何调用该函数，应该是：

 table(2,4);

The following Snippet demonstrates an alternate way of creating tables. 以下代码段演示了创建表的另一种方法。 Details commented in Snippet. 摘录中的详细信息。

SNIPPET SNIPPET

 <!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 (ie <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>

试图让HTML表格与Javascript中的document.write一起出现

问题描述

1 个解决方案

解决方案1
3 2017-01-08 03:21:58

试图让HTML表格与Javascript中的document.write一起出现

问题描述

1 个解决方案

解决方案1 3 2017-01-08 03:21:58

解决方案1
3 2017-01-08 03:21:58