Форум

AnatolyS · #1 (**permalink**) 13.06.2014, 23:16

Доброго времени суток! Предполагаю, мой вопрос окажется странным.
Пишу один из первых скриптов, в конечном итоге должна создаваться таблица с заданным количеством строк и столбцов.
На данном этапе разработки в консоли браузеров появляется ошибка (сабж).

<html>
<head>
<title>Создание таблиц | Javascript</title>
<meta charset="utf-8" /> 
</head>
<body>
<input type="submit" value="Create" name="create" onclick="create_table()" />
<script language="JavaScript" type="text/javascript">
	function create_table() {
		var x = document.createElement('table');
		x.setattribute("border", "1");
		var row = table.insertRow(2);
		var cell = row.insertCell(1);
		cell.innerHTML = 'Ячейка';
		document.body.appendChild(table);
	}
</script>
</body>
</html>

Прошу помощи

рони · #2 (**permalink**) 14.06.2014, 00:06

AnatolyS,
http://learn.javascript.ru/attribute...трибуты

jsnb · #3 (**permalink**) 14.06.2014, 06:51

x.setattribute("border", "1");

setAttribute - размер имеет значение.

var row = table.insertRow(2);

Что за table? Если имеется ввиду новосозданная таблица x, то то как в нее можно вставить строку с индексом 2?

var cell = row.insertCell(1);

Тоже самое, что и со строкой - откуда в пустой строке возьмется ячейка с индексом 1?

AnatolyS · #4 (**permalink**) 14.06.2014, 11:45

jsnb,
невнимательно читал инструкции, преодполагал, что 2 и 1 - не показатели индекса, а показатели количества строк и ячеек.
исправил код, все равно не работает пока:

<script language="JavaScript" type="text/javascript">
	function create_control() {
		var table = document.createElement('table');
		table.setAttribute("border", "1");
		var row = table.insertRow(0);
		var cell = row.insertCell(0);
		cell.innerHTML = 'Ячейка';
		document.body.appendChild('table');
	}
</script>

jsnb · #5 (**permalink**) 14.06.2014, 11:50

document.body.appendChild('table');

Тут кавычки не нужны. Пиши так: document.body.appendChild(table);

Кстати, если у insertRow и insertCell указать индексом -1, то строка/ячейка будут вставлены в конец т.е. после последней строки/ячейки.

AnatolyS · #6 (**permalink**) 14.06.2014, 16:00

Доделал. Может быть, кому-нибудь сгодится:

<html>
<head>
<title>Создание таблиц | Javascript</title>
<meta charset="utf-8" /> 
</head>
<body>
<p>
Количество строк: <input type="number" value="Количество строк" id="rows_numb" min="0"/>
Количество столбцов: <input type="number" value="Количество строк" id="cells_numb" min="0"/>
Класс таблицы: <input type="text" id="table_class"/>
<input type="submit" onclick="create_control()" />
</p>

<script language="JavaScript" type="text/javascript">
	function create_control() {
		var table = document.createElement('table');
		var tclass = document.getElementById('table_class').value;
		table.setAttribute('class', tclass);
		table.setAttribute('border', '1');
		var x = document.getElementById('rows_numb').value;
		var y = document.getElementById('cells_numb').value
		for (var n = 0; n < x; n++) {
			var row = table.insertRow(-1);
			for (var m = 0; m < y; m++) {
			var cell = row.insertCell(-1);
			cell.innerHTML = '#' + m; 
			}
		}
		document.body.appendChild(table);
	}
</script>
</body>
</html>

Программа, которая генерирует таблицу с заданными классом, количеством строк и столбцов; каждая ячейка имеет свой порядковый номер.

Форум

Справочник

Discord чат

Курсы javascript