Модераторы: Sardar, Aliance
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Создание элементов. Функция createElement 
:(
    Опции темы
123
Дата 16.8.2007, 17:34 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 20
Регистрация: 28.7.2006

Репутация: нет
Всего: нет
Вот html текст:
Код

<DIV id="ID_hint" style="width:200px; height:200px; position:absolute; left:50px; top:50px; visibility:hidden; CURSOR: help;">
<TABLE cellSpacing=0 cellPadding=3 width="200" border=0 style="border:1px solid #000000; CURSOR: help;">
<TR><TD style="COLOR: green; CURSOR: help;" bgColor=#ffffe1>
                <p align="center">TEST</p>
 </TD></TR></TABLE></DIV>


Надо тоже самое сделать на js.
Вот что получилось у меня:

Код

function addtablerror(id,text)
{

var div = document.createElement("div");
    div.id=id+'_hint';
    div.style.width='200px';
    div.style.height='200px';
    div.style.position='absolute';
    div.style.left='50px';
    div.style.top='50px';
    div.style.visibility='visible';
    div.style.cursor='help';
var table = document.createElement("table");
    table.style.border='1px';
    table.style.solid='#000000';
    table.cellSpacing='0';
    table.cellPadding='3';
    table.width='200';
var tr = document.createElement("tr");
var td = document.createElement("td");
    td.style.color='green';
    td.bgColor='#ffffe1';
    td.innerHTML=text;

tr.appendChild(td);
table.appendChild(tr);
div.appendChild(table);
document.body.appendChild(div);

}



Он создает примерно то что надо, но ОЧЕНЬ криво. Есть преположения, что я объекты таблицы неправильно создаю..
Покажите пожалуйста на мои ошибки.

Это сообщение отредактировал(а) 123 - 16.8.2007, 17:41
PM MAIL   Вверх
Astraller
Дата 16.8.2007, 19:56 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 300
Регистрация: 1.8.2007
Где: $Украина[Кры м]->Феодосия

Репутация: 2
Всего: 5
Уважаемый, разберить сначала со style'выми свойствами JS. 
К примеру нет свойства node.style.solid!
Есть node.style.border="1px solid #000;"

 smile 


--------------------
A.S.T.R.A.L.L.E.R.: Artificial Synthetic Technician Responsible for Assassination, Logical Learning and Efficient Repair
PM MAIL WWW ICQ   Вверх
123
Дата 16.8.2007, 23:11 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 20
Регистрация: 28.7.2006

Репутация: нет
Всего: нет
Исправил, спасибо.

А какие есть идеи по самому коду? Ведь он явно как-то криво написан.
PM MAIL   Вверх
dXdYdZ
Дата 17.8.2007, 00:04 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 146
Регистрация: 16.4.2007

Репутация: 3
Всего: 4
В своей библиотеке для этих целей я сделал функцию mixin:
Код

JSL.mixin=function(obj1,obj2)
{
for(var n in obj2) obj1[n]=obj2[n];
}

Теперь Ваш код можно переписать так:
Код

function addtablerror(id,text)
{
var div = document.createElement("div");
    div.id=id+'_hint';
    JSL.mixin(div.style,{width: "200px",height: "200px",position: "absolute",left: "50px",top:"50px",visibility: "visible",cursor: "help"});
var table = document.createElement("table");
    table.style.border='1px solid #000';
    mixin(table,{cellSpacing: 0,cellPadding: 0,width: 200});
var tr = document.createElement("tr");
var td = document.createElement("td");
    td.style.color='green';
    mixin(td,{bgColor: "#ffffe1",innerHTML: text});
tr.appendChild(td);
table.appendChild(tr);
div.appendChild(table);
document.body.appendChild(div);
}


Добавлено через 2 минуты и 11 секунд
А ещё для задания стилей можно использовать свойство cssText:
Код

node.style.cssText="border: 1px solid #000; width: 200px; height: 200px;";

И так далее...
PM MAIL   Вверх
Ghirik
Дата 30.8.2007, 11:32 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 919
Регистрация: 26.3.2007

Репутация: 13
Всего: 20
Класно, dXdYdZ, хороший подробный ответ, сейчас и испытаем.

P.S.Жалко, ещё не могу плюсики ставить.


--------------------
Отдадим всё клиенту, пускай его машина мучается...
PM MAIL   Вверх
Ghirik
Дата 31.8.2007, 08:43 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 919
Регистрация: 26.3.2007

Репутация: 13
Всего: 20
Вот попробовал:
Код

<html>
<head>
<meta http-equiv="Content-Language" content="en-us">
<script language="javascript">
<!--
function mixin(obj1,obj2){
    for    (var n in obj2) obj1[n]=obj2[n];
}

function addtablerror(id,text)
{
var div = document.createElement("div");
    div.id=id+'_hint';
    mixin(div.style,{width: "200px",height: "200px",position: "absolute",left: "50px",top:"50px"});
var table = document.createElement("table");
    table.style.border='3px solid #000';
    mixin(table,{cellSpacing: 0,cellPadding: 0,width: 400});
var tr = document.createElement("tr");
var td = document.createElement("td");
    //td.style.color='green';
    mixin(td,{innerHTML: text});
tr.appendChild(td);
table.appendChild(tr);
div.appendChild(table);
document.body.appendChild(div);
}

//-->
</script>
</head>
<body>
<div id=div1></div>
<p><a href=# onClick="addtablerror(div1,'fgfgffhh fhfgfghfhg')">dfgdfgdfgdfdfg</a></p>
</body>
</html>


Но, в IE не работает. Почему?
Смотрел под IE, объекты создаются, свойства присваиваются. Чего то он не понимает.


--------------------
Отдадим всё клиенту, пускай его машина мучается...
PM MAIL   Вверх
MisterCleric
Дата 31.8.2007, 09:10 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Завсегдатай
Сообщений: 1043
Регистрация: 16.2.2006
Где: Харьков, Украина

Репутация: нет
Всего: 38
Вообще у тега teble его children могут быть THEAD, TFOOT, TBODY. Хоть обычно мы пользуемся TR, TD, но в сгенерированном HTML всегда они обернуты в TBODY. Так что если ты скриптом формируешь таблицу, то надо так:
Код

var tr = document.createElement("tr");
var td = document.createElement("td");
    //td.style.color='green';
    mixin(td,{innerHTML: text});
tr.appendChild(td);
var tbody = document.createElement("tbody");
tbody.appendChild(tr);
table.appendChild(tbody);
div.appendChild(table);


Ну а там разберись, как у тебя по коду должно быть. 


--------------------
ПРИШЕЛ, УВИДЕЛ - ПЕРЕПИСАЛ...
PM MAIL ICQ   Вверх
Ghirik
Дата 31.8.2007, 09:23 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 919
Регистрация: 26.3.2007

Репутация: 13
Всего: 20
Спасибо, всё заработало везде. smile 



--------------------
Отдадим всё клиенту, пускай его машина мучается...
PM MAIL   Вверх
  
 Ответ в темуСоздание новой темы Создание опроса
Форум для вопросов, которые имеются в справочниках, но их поиск вызвал затруднения, или для разработчика требуется совет или просьба отыскать ошибку. Напоминаем: 1) чётко формулируйте вопрос, 2) приведите пример того, что уже сделано, 3) укажите явно, нужен работающий пример или подсказка о том, где найти информацию.
 
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: Общие вопросы | Следующая тема »

Подписаться на тему | Подписка на этот форум | Скачать/Распечатать тему


 




[ Время генерации скрипта: 0.0535 ]   [ Использовано запросов: 22 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
 По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.