Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   помогите с таблицей (https://javascript.ru/forum/dom-window/16966-pomogite-s-tablicejj.html)

simple 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 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 30.04.2011 19:52

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

poorking 30.04.2011 19:57

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

melky 30.04.2011 19:59

он про это

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


r=t.insertRow(-1);

simple 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 30.04.2011 20:13

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

poorking 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 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 30.04.2011 20:42

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


Часовой пояс GMT +3, время: 23:47.