2014-11-12 2 views
0

Использование следующего кода для добавления таблицы html в элемент. Я хотел бы добавить тонкую серая рамка линии вокруг cell2, cell3, cell4 & cell5. Я знаю, как это сделать для обычной таблицы HTML, но я не уверен, как добавить его, чтобы вернуть его как innerHTML.Возврат элемента HTML в виде таблицы

var table = document.createElement('table'); 
var row0 = table.insertRow(0); 
var cell1 = row0.insertCell(0); 
cell1.innerHTML = "My Table"; 

var row1 = table.insertRow(1); 
var cell2 = row1.insertCell(0); 
var cell3 = row1.insertCell(1); 
cell2.innerHTML = "Id"; 
cell3.innerHTML = "1019201" + "</br>"; 

var row2 = table.insertRow(2); 
var cell4 = row2.insertCell(0); 
var cell5 = row2.insertCell(1); 
cell4.innerHTML = "Name"; 
cell5.innerHTML = "John Doe" + "</br>"; 

return table.innerHTML; 
+0

где код, который использует его? – DevelopmentIsMyPassion

ответ

1

Вы можете попробовать что-то вроде этого

<script> 


var table = document.createElement('table'); 
table.setAttribute('border', '5px solid black;'); 
var row0 = table.insertRow(0); 
var cell1 = row0.insertCell(0); 
cell1.innerHTML = "<center><b> <FONT COLOR='FF6600'> Feature Properties </FONT> </b> </center> </br>"; 

var row1 = table.insertRow(1); 
var cell2 = row1.insertCell(0); 
var cell3 = row1.insertCell(1); 
cell2.innerHTML = "Id"; 
cell3.innerHTML = "1019201" + "</br>"; 

var row2 = table.insertRow(2); 
var cell4 = row2.insertCell(0); 
var cell5 = row2.insertCell(1); 
cell4.innerHTML = "Name"; 
cell5.innerHTML = "John Doe" + "</br>"; 
var div = document.createElement('divTable'); 
div.appendChild(table); 
document.write(div.innerHTML); 

</script> 
+1

thansk за помощью – John

1

Вы на самом деле не возвращаются к столу, вы только вернув материал внутри таблицы ...

return table.innerHTML; 

innerHTML не будет включать в себя <table> элемент, который оборачивает его.

Если вы вернули таблицу, вы можете добавить ее, а не вставлять HTML-код в контейнер.

return table; 

Теперь у вас есть табличное элемент, который вы можете добавить на свою страницу ...

document.getElementById('myelem').appendChild(table); 

Это позволит решить вопрос, как судороги строк не будет сироту из таблицы.

Вы можете использовать CSS для стилизации всего этого - сообщите мне, если вам нужна помощь в этом.

Смежные вопросы