Создайте tr с каждыми четырьмя столбцами в javascript

Question

Я создал и закрою tr после каждых четырех столбцов. У меня уже есть ответы на этот вопрос, но я нашел это в jquery. Но я должен сделать это только в javascript.

Я пишу код, но это кажется неправильным. Fiddle

var html= ""; 
for(var i =0;i<9;i++){ 
    if(i%4 == 0){ 
    html+='<tr>'; 
    } 
    html+="<td>"+i+"</td>"; 
    if(i%4==0 && i!=0 || i == 8){ 
    html+="</tr>" 
    } 
} 
document.querySelector('#test').innerHTML = html; 

Answer 1

Проблема с вашим тегом логики закрытия, это не добавляя закрывающий тег в правильном месте. Чтобы добавить закрывающую скобку в нужном месте, вы можете сделать это:

var html= ""; 
for(var i =0;i<9;i++){ 
    if(i%4 == 0){ 
    html+='<tr>'; 
    } 
    html+="<td>"+i+"</td>"; 
    if(i%4==3){ //this will place the closing tag in the right spot. 
    html+="</tr>" 
    } 
} 
document.querySelector('#test').innerHTML = html; 

Updated fiddle

Answer 2

ТР после каждых четырех колонн.

var html= ""; 
 
for(var i =0;i<9;i++){ 
 
\t if(i%4 == 0 && i != 4){ 
 
    console.log(i) 
 
    html+='<tr>'; 
 
    } 
 
    
 
    if(i==4 || i == 8){ 
 
    console.log(i) 
 
    html+="</tr>" 
 
    } 
 
    if(i==4){ 
 
    console.log(i) 
 
    html+="</tr>" 
 
    html+="<tr>" 
 
    } 
 
    html+="<td>"+i+"</td>"; 
 
} 
 
document.querySelector('#test').innerHTML = html;

<table id="test"></table>

Here is the fiddle,

Answer 3

Вы можете упростить вещи, просто опустив закрывающие теги для й, и т.д т.р. элементов, например,

var html = '<table>'; 
 

 
for(var i=0; i<9; i++){ 
 

 
    if(i%4 == 0) { 
 
    html += '<tr><th>' + i; 
 

 
    } else { 
 
    html += '<td>' + i; 
 
    } 
 
} 
 
html += '</table>'; 
 
document.write(html);

Или, если вы хотите более сжатый код:

for(var i=0, html='<table>'; i<9; i++){ 
 
     html += (i%4 == 0? '<tr><th>' : '<td>') + i; 
 
    } 
 
    html += '</table>'; 
 

 
document.write(html);