Форум

simple · #1 (**permalink**) 30.04.2011, 19:25

Здравствуйте, помогите создать таблицу средствами JS. К уже созданной таблице я могу добавлять строки и удалять их а вот чтоб создать таблицу с нуля чего то не выходит ни как. Пишу следующее:

t=document.createElement('table').tBodies[0];
  r=t.insertRow(-1);
   c=r.insertCell(0);
   c.innerText='таблица';
   document.body.appendChild(t);

Не хочет создаваться, выдает ошибку на строке r=t.insertRow(-1);

Браузер у меня IE8

poorking · #2 (**permalink**) 30.04.2011, 19:42

<!DOCTYPE html>
	<script type = "text/javascript">
	window.onload = function(){
		document.body.appendChild(
			function(rows, cols){
				var table = document.createElement("TABLE"), tr, td;
				
				for(var r = 0; r < rows; r ++){
					table.appendChild(
						(function(){
							tr = document.createElement("TR");
							for(var c = 0; c < cols; c ++){
								tr.appendChild(
									(function(){
										td = document.createElement("TD");
										td.innerHTML = "row: " + r + ", cell: " + c;
										td.style.border = "1px solid red";
										return td;
									}())
								)
							}
							return tr;
						}())
					)
				}
				return table;
			
			}(10, 7)
		
		)
	}
	</script>

simple · #3 (**permalink**) 30.04.2011, 19:52

Спасибо. Но у меня в IE не работает ( Хотя сейчас через IE зашел на сайт Ваш пример работает, копирую скрипт себе запускаю, не работает

poorking · #4 (**permalink**) 30.04.2011, 19:57

Вы в своем браузере нажимали кнопочку "Посмотреть"? что здесь может не работать? У меня к сожалению только IE9, но этот код должен везде работать, здесь не используются всякие опасные методы createElement везде есть

melky · #5 (**permalink**) 30.04.2011, 19:59

он про это

с конца не вставляется

r=t.insertRow(-1);

simple · #6 (**permalink**) 30.04.2011, 20:09

Я просто не могу понять почему у меня не работает этот пример:

<script type = "text/javascript">
var oTbl=document.createElement("Table");
for(i=0;i<3;i++)
{
 var  oTR= oTbl.insertRow(i);
 for(j=0;j<3;j++)
 {
  var  oTD= oTR.insertCell(j);      
       oTD.InnerText="111";}
document.body.appendChild(oTbl);
</script>

Выдает ошибку: document.body is null or not an object
Вроде ведь все правильно

simple · #7 (**permalink**) 30.04.2011, 20:13

poorking, да извиняюсь работает Ваш код

poorking · #8 (**permalink**) 30.04.2011, 20:22

melky,
в ie8 insertRow/Cell(-1) не работает? ну не знаю, я вообще этими методами никогда не пользовался

<!DOCTYPE html>
<script type = "text/javascript">
//Этот код на этой странице у меня тоже не работает
var table = document.createElement("TABLE");
		
		for(var r = 0; r < 10; r ++){
			var row = table.insertRow(-1);
			for(var c = 0; c < 10; c ++){
				var cell = row.insertCell(-1);
				cell.innerHTML = r + "-" + c;
				cell.style.border = "1px solid red";
			}
		}
		
		document.body.appendChild(table);
</script>

Не знаю чего не работает. Мне этими методами и не приходилось пользоваться если честно, не знаю о их кроссбраузерности. Они нужны только если вместо insertBefore, так как он с таблицами в ie как раз вроде некорректно работает

melky · #9 (**permalink**) 30.04.2011, 20:31

тег <body> забыли

<!DOCTYPE html>
<body></body>
<script type = "text/javascript">

var table = document.createElement("TABLE");
		
		for(var r = 0; r < 10; r ++){

			var row = table.insertRow(-1);

			for(var c = 0; c < 10; c ++){

				var cell = row.insertCell(-1);
				cell.innerHTML = r + "-" + c;
				cell.style.border = "1px solid red";

			}
		}
		
		document.body.appendChild(table);
</script>

poorking · #10 (**permalink**) 30.04.2011, 20:42

melky,
ай точно, предыдущий пример я завернул в window.onload, браузер его дорисовал

Форум

Справочник

Discord чат

Курсы javascript