Javascript-форум - сгенеритьтабличку под IE

Javascript-форум (https://javascript.ru/forum/)

- Internet Explorer (https://javascript.ru/forum/css-html-internet-explorer/)

- - сгенеритьтабличку под IE (https://javascript.ru/forum/css-html-internet-explorer/8947-sgenerittablichku-pod-ie.html)

сгенеритьтабличку под IE

<HEAD>
<STYLE>
TD {
border-collapse:collapse;
border:solid windowtext 1.0px;
text-align:center;
font-size:7.0pt;
padding:0px;
}
.Tablica {
border-collapse:collapse;
border:solid windowtext 1.0px;
table-layout:fixed;
text-align:center;
font-size:12.0pt;
}
.TH1_ {
border-collapse:collapse;
border:solid windowtext 1.0px;
text-align:center;
font-size:12.0pt;
}
col {
text-align:center;
width:17px;
}
</STYLE>
</HEAD>
<BODY>
<script>
var _parent=document.body;
var newTabl=document.createElement('table');
newTabl.className='Tablica';
newTabl.width='31*';
var newTB=document.createElement('tbody');
var newCol=document.createElement('col');
newCol.span='31';
var newTr1=document.createElement('tr');
var newTr2=document.createElement('tr');
var newTh1=document.createElement('th');
newTh1.className='TH1_';
newTh1.colspan='31';
newTh1.setAttribute('colspan', '31'); //не знаю наверняка для IE

newTB.appendChild(newCol);
newTh1.appendChild(document.createTextNode("string 1"));
newTr1.appendChild(newTh1);
newTB.appendChild(newTr1);
for (var i=0; i<31; i++) {
var newTD=document.createElement('td');
newTD.appendChild(document.createTextNode(i+1));
newTr2.appendChild(newTD);
}
newTB.appendChild(newTr2);
newTabl.appendChild(newTB);
_parent.appendChild(newTabl);
</script>
</BODY>

Нашёл глюк: colspan=31 работает только как colSpan=31;

Атрибут width="31*" не работает, если указать точную длину width="527" то нормально строит.
Однако при нединамическом построении
<table class="Tablica" width="31*">
работает.

Элемент <Col> вообще ничего не даёт либо его свойства span=31 width=17 нужно задавать как-то иначе, т.е. объявление нескольких столбцов точной длины просто игнорируется.

Цитата:

Сообщение от al666

Нашёл глюк: colspan=31 работает только как colSpan=31;

Никакой это не глюк, а ваша ошибка. В JavaScript свойства именуются в стиле lowerCamelCase.

Цитата:

Сообщение от al666

Атрибут width="31*" не работает, если указать точную длину width="527" то нормально строит.

Свойство и атрибут — разные вещи http://xpoint.ru/know-how/JavaScript/Atributyi

Цитата:

Сообщение от al666

Элемент <Col> вообще ничего не даёт либо его свойства span=31

Цитата:

Сообщение от http://htmlbook.ru/html/col.html

span Количество колонок, к которым следует применять параметры.

И оформляйте свой код: http://javascript.ru/formatting

по существу - 0
За "span" отдельное спасибо, я его так влепил, бездумно.

Вопрос такой, createElement('col') даёт что-либо или это не работает в IE, после создания и установки свойств их можно прочесть, однако на экране изменений нет.

В IE то работает. И в Firefox работает, а вот Opera и Chrome не реагируют:

<table border="1">
	<tr>
		<td>1</td>
		<td>2</td>
	</tr>
</table>
<button onclick="F()">Enlarge width</button>
<script type="text/javascript">
function F() {
	var table = document.getElementsByTagName("table")[0];
	var colgroup = document.createElement("colgroup");
	var col = document.createElement("col");
	col.span = 2;
	col.width = 200;
	colgroup.appendChild(col);
	table.appendChild(colgroup);
}
</script>

От спасибо, элемент 'colgroup' действительно выправил мой кривой код, получилось то что надо, за небольшой мелочью - таблица фиксированной длины только в IE, а Опера сдвигает при изменении размера окна. Зафиксировать без явного указания размера всей таблицы не выходит.

<html><head><title>Project</title>
<style>col {width:140px;} table {table-layout:fixed;}</style>
</head>

 <body><script>
    var _parent=document.body;
    var newTabl=document.createElement('table');
    var newTB=document.createElement('tbody');
    var colgroup = document.createElement('colgroup');
    var newCol=document.createElement('col');
    var newTr=document.createElement('tr');
    var newTh=document.createElement('th');
    var newTr2=document.createElement('tr');
    var newTd1=document.createElement('td');
    var newTd2=document.createElement('td');
    var newTd3=document.createElement('td');

     newTabl.border=1;
     newTh.colSpan=3;
     newCol.span=3;

     colgroup.appendChild(newCol);
     newTB.appendChild(colgroup);

        newTh.appendChild(document.createTextNode("0"));
       newTr.appendChild(newTh);
      newTB.appendChild(newTr);

        newTd1.appendChild(document.createTextNode("1"));
        newTd2.appendChild(document.createTextNode("2"));
        newTd3.appendChild(document.createTextNode("3"));
       newTr2.appendChild(newTd1);
       newTr2.appendChild(newTd2);
       newTr2.appendChild(newTd3);
      newTB.appendChild(newTr2);
     newTabl.appendChild(newTB);
    _parent.appendChild(newTabl);
  </script></body></html>

Кстати, вот такой статичный вариант отрабатывает одинаково как в IE так и Opera:

<html><head><title>Project</title>
  <style>col {width:140px;} table {table-layout:fixed;width:0;}</style>
 </head>

 <body>
   <table border=1>
    <col span=3>
     <tr><th colSpan=3>0</th></tr>
     <tr><td>1</td><td>2</td><td>3</td></tr>
</table></body></html>

Кстати, для работы с таблицами предусмотрены специальные методы и коллекции http://webew.ru/articles/598.webew