Форум

Юрий123456 · #1 (**permalink**) 27.01.2021, 14:04

Разрабатываю Звездную карту из БД, хочу построить ее в ячейках таблицы, динамическим выводом , не могу разобраться возможно ли сделать динамический вывод в определенный див , если делаю document.write - то создает на чистой страницы , так не годиться.
Спасибо.
Пробовал сделать построение так не работает..

let as123 = document.getElementById("tableKK")
var cols = 3;
var rows = 3;
cols = parseInt(cols);
rows = parseInt(rows);
if (cols<1 || rows <1) {
cols = 1;
rows = 1;
}
as123.write(' <table border=1, cellpadding=2, cellspacing=0, width="90%">');
for (i = 0; i <= cols; i++)
{
as123.write("<tr>");
for (k = 0; k <= rows; k++)
{

if (k == 0) {
as123.write('<td style="background-color:orange">');
as123.write(i);

}
else
if (i == 0) {
as123.write('<td style="background-color:orange">');
as123.write(k);

}
else {
as123.write('<td style="background-color:silver">');
as123.write(i * k);

}

as123.write("</td>");
}

as123.write("</tr>");
}
as123.write("</table>");

})

voraa · #2 (**permalink**) 27.01.2021, 14:29

Используйте функции DOM

document.createElement
https://developer.mozilla.org/ru/doc....createElement

appenChild и append
https://developer.mozilla.org/ru/doc...de/appendChild
https://developer.mozilla.org/ru/doc...entNode/append

В крайнем случае задавайте html текст через innerHTML
https://developer.mozilla.org/ru/doc...ment/innerHTML

Используя createElement это делается как то так

<head>
<style>
	th {
		background-color: orange;
	}
	td {
		background-color: silver;
	}
	table {
		width:90%;
		border: blue 1px solid;
	}
</style>
</head>
<body>
<div id=tableKK>
</div>

<script>
let cols = 3;
let rows = 3;
let tb = document.createElement('table');
for (let nr = 0; nr<rows; nr++) {
	let row = document.createElement('tr')
	for (let nc = 0; nc<cols; nc++) {
		let cell = document.createElement((nr==0 || nc==0)? 'th' : 'td')
		cell.textContent = '' + nr + ', ' + nc;
		row.append(cell);		
	}
	tb.append(row);
}
document.getElementById("tableKK").append(tb);
</script>
</body>

рони · #3 (**permalink**) 27.01.2021, 14:42

Юрий123456,
Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:

[html run]
... минимальный код страницы с вашей проблемой
[/html]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

Форум

Справочник

Discord чат

Курсы javascript