Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Что-то стиль не подхватывает в innerHTML / 25 сообщений из 26, страница 1 из 2
  1  все
16.06.2009, 09:23
    #36042685
smm
smm
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
Всем привет!

Тут такая проблемка: генерится строка HTML вместе с тэгом STYLE и это все присваивается к innerHTML. Результат -HTML отображается, а стиль к нему не применяется. Вот примерчик:
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
...
ajaxDiv.innerHTML=""+
"<STYLE>"+
"#q{"+
"border-width:0.5pt;"+
"border-style:solid;"+
"border-color:#000000;"+
"cellpadding:0;"+
"cellspacing:0;"+
"}"+
"</STYLE>"+
"<TABLE>"+
"<TR><TD id='q'>dat1</TD></TR>"+
"<TR><TD id='q'>dat2</TD></TR>"+
"<TR><TD id='q'>dat3</TD></TR>"+
"</TABLE>";
...

Таблица отрисовывается какими то дефолтными установками. Все работает если я в каждый <TD> буду вставлять строку STYLE с установкой параметров. В чем тут дело?

PS:Стиль применяю к тегу TD, поскольку если стиль применяется к тегу TABLE, то в разных браузерах не отрабатывает как надо. Пробовал и через CLASS='q' указывая в описании STYLE td.q, все равно не пашет.{ }
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.06.2009, 09:36
    #36042710
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
Всегда описание стилей делал только в <head></head>...
----------
Cache for Windows (x86-32) 2007.1.3 (Build 607) Wed Oct 17 2007 02:12:09 EDT
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.06.2009, 09:42
    #36042719
ShSerge
ShSerge
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
krvsa,

Да нет, креатеэлемент и аппендчилд с указанием откуда - прекрасно катит. Это способ менять стили без перезагрузки страницы.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.06.2009, 10:10
    #36042779
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
Ясно... Просто "динамически" стили никогда не менял, всегда делали т.с. "полный комплект", а потом работали с className...
----------
Cache for Windows (x86-32) 2007.1.3 (Build 607) Wed Oct 17 2007 02:12:09 EDT
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.06.2009, 10:22
    #36042812
smm
smm
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
ShSerge,

а можно поподробней, как динамически стиль создать? Если можно кусок примера...
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.06.2009, 10:48
    #36042871
ShSerge
ShSerge
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
Нет проблем. Даже не кусон, а работающий примерчик.
Файл s1.css :
Код: plaintext
1.
body{background-color:white}
Файл s2.css :
Код: plaintext
1.
body{background-color:blue}
Файл s3.css :
Код: plaintext
1.
body{background-color:red}
Файл test.html :
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
<html>
<script>
function chg(v){
	var g=document.getElementById("garbage");
	st=document.createElement("LINK");
	st.rel="Stylesheet";
	st.href=v;
	g.innerHTML="";
	g.appendChild(st);
}
</script>
<body>
<select onchange="chg(this.value)">
<option value="s1.css">Белый</option>
<option value="s2.css">Синий</option>
<option value="s3.css">Красный</option>
</select>
<div id="garbage"></div>
</body>
</html>
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.06.2009, 10:54
    #36042888
ShSerge
ShSerge
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
В принципе, и криэйтить не обязательно каждый раз, достаточно только в st.href=v; менять каждый раз этот v .
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.06.2009, 12:39
    #36043240
smm
smm
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
За пример спасибо, все понял.

Но тут у меня такая особенность, что стиль хранится не в файле, определяется динамически (по переданным параметрам). Т.е. в моем случае надо как-то создать элемент STYLE и вставить его куда надо. Как стиль программно создать и применить?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.06.2009, 12:51
    #36043280
vkle
vkle
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
Посмотрите тут http://dev.opera.com/articles/view/dynamic-style-css-javascript/
Posted via ActualForum NNTP Server 1.4
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.06.2009, 12:51
    #36043285
ShSerge
ShSerge
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
А так:
Код: plaintext
1.
<link rel="stylesheet" type="text/css" href="мой_серверный скрипт?par1=val1&par2=val2"...
Где мой_серверный скрипт - программа на пхп или асп или ещё на чём.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.06.2009, 15:37
    #36043871
smm
smm
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
ShSerge, тут серверного скрипта нет, стиль строит функция на JS

Решил попробовать через создание элем-та STYLE и его последующее добавление к BODY

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
...
ajaxStyle=document.createElement("STYLE");
ajaxStyle.innerHTML=""+
"#q{"+
"border-width:0.5pt;"+
"border-style:solid;"+
"border-color:#000000;"+
"cellpadding:0;"+
"cellspacing:0;"+
"}";
...
ajaxDiv=document.createElement("DIV");
ajaxDiv.innerHTML=""+
"<TABLE>"+
"<TR><TD id='q'>dat1</TD></TR>"+
"<TR><TD id='q'>dat2</TD></TR>"+
"<TR><TD id='q'>dat3</TD></TR>"+
"</TABLE>";
...
document.body.appendChild(ajaxStyle);
document.body.appendChild(ajaxDiv);
...

В Фоксе все работает

IE валится на
Код: plaintext
1.
ajaxStyle.innerHTML=""+

Что нужно исправить не подскажете?

PS: Что интересно и Фокс и IE на
Код: plaintext
ajaxDiv.innerHTML=""+
отрабатывают, IE падает если элемент типа STYLE.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.06.2009, 16:10
    #36043968
ShSerge
ShSerge
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
smm...IE падает если элемент типа STYLE.
Есть такая беда. Я тоже где-то замечал. Подумать надо.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.06.2009, 16:12
    #36043971
ShSerge
ShSerge
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
А document.write не подойдёт?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.06.2009, 16:52
    #36044142
smm
smm
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
При write у меня страница очищается и висит 8O
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.06.2009, 20:35
    #36044630
ShSerge
ShSerge
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
Если его писать, где нужно, а не при загрузке страницы - всё получится.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
17.06.2009, 09:11
    #36045055
smm
smm
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
А где его нужно писать?

У меня сейчас схема следующая:
-имеется загруженная в браузер HTML страница
-по определенному событию на этой странице вызывается JS-функция
-в этой функции происходит создание элемента DIV (через createElement('DIV')
-проводим некоторое рисование в DIV
-после создания элемента создается элемент типа STYLE (через createElement('STYLE')
-теперь как-то нужно присвоить созданному элементу STYLE описание стиля. Сейчас я это делаю через <элемент STYLE>.innerHTML="...", но это работает только в ФОКСЕ, а в IE вылетает
-через document.body.appendChild(<элемент STYLE>) добавляем стиль к документу
-через <Некоторый элемент>.appendChild(<элемент DIV>) добавляем на страницу DIV

Куда и как нужно писать WRITE?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
17.06.2009, 12:57
    #36045798
vkle
vkle
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
А объекту через свойство className стиль не присваивается чтоли в ИЕ?
Posted via ActualForum NNTP Server 1.4
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
17.06.2009, 15:30
    #36046219
smm
smm
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
Всем спасибо!

Проблему решил. Способ иллюстрирует следующий код (нагуглил)

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
var ss1 = document.createElement('style');
var def = 'body {color: red;}';
ss1.setAttribute("type", "text/css");
if (ss1.styleSheet) {   // IE
    ss1.styleSheet.cssText = def;
} else {                // the world
    var tt1 = document.createTextNode(def);
    ss1.appendChild(tt1);
}
var hh1 = document.getElementsByTagName('head')[ 0 ];
hh1.appendChild(ss1);

PS:
Хотя хотелось бы найти кроссбраузерный вариант без условий типа IF THEN
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
17.06.2009, 22:31
    #36047174
IDVsbruck
IDVsbruck
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
Получаю с сервера контент в виде:
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
<style type="text/css">
	#general_text {height:300px; width:800px; position:relative; overflow:hidden; left:13px; top:13px; font:10pt Verdana; color:# 333 ; text-align:left;}
	#home_link {background:url("images/first/home_button.png") no-repeat 0px 0px;}
</style>
<div id="general_text">
	Login<br/>
	<input type="text" class="redesign_edit"/>
</div>
...
<script type="type/javascript">
...
</script>
и все видится, все используется ... перечитал тему несколько раз - проблему не понял.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
18.06.2009, 09:24
    #36047463
smm
smm
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
IDVsbruck,

Тут проблема была в том, что с сервера приходит только HTML страница, а дальше уже на клиенте через JS-функции создаются динамически новые элементы и стили для отображения этих элементов по различным параметрам. И плюс к этому, чтобы работало в разных браузерах.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Период между сообщениями больше года.
26.07.2010, 21:36
    #36760541
itstrue
itstrue
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
Такая же проблема, грузится контент удаленно и наполняется в блок div через InnerHTML:

document.getElementById("Block_27").innerHTML = '<style>...</style>текст';

Работает везде кроме Осла. Как решить?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.07.2010, 21:37
    #36760545
itstrue
itstrue
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
Имел ввиду, что стиль применяется везде кроме в IE.

Осел понимает только если писать вроде такого <a href="#" style="color:red;">link</a>, а если стиль заключить в style не понимает
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.07.2010, 03:04
    #36760768
st_st
st_st
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
Подключение готового css-файла:
Код: plaintext
1.
2.
3.
4.
5.
/* main.css */ 

.reds { 
    background:red 
}

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
<!DOCTYPE HTML PUBLIC  "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
<title></title> 

<script> 

function ulink() { 
    var link=document.createElement('link'); 
    link.rel='stylesheet'; 
    link.type='text/css'; 
    link.href='main.css'; 
    document.getElementsByTagName('head')[ 0 ].appendChild(link); 
} 

</script> 

</head> 
<body>

<input type="button" value="Новый стиль" onclick="ulink()"> 

<div class="reds">xxx</div> 

</body> 
</html>

Создание нового элемента и назначение ему стилей -
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
<!DOCTYPE HTML PUBLIC  "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
<title></title> 

<script> 

function ulink() { 
	var div=document.createElement('div');
	div.style.border='1px solid red'; 
	div.style.width='100px';
	div.style.height='100px';  
	document.body.appendChild(div); 
} 

</script> 

</head> 
<body>

<input type="button" value="Новый div" onclick="ulink()"> 

</body> 
</html>

Работает везде. Если получаем страницу с сервера через ajax, то прицепляем готовый css, если создаём отдельные элементы, то добавляем стили во время их создания.
Поэтому не ясно, зачем мудрить <style> и тому подобное.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.07.2010, 15:14
    #36761955
itstrue
itstrue
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
Потому что это кэш блока, который отдается на удаленном сайте. Кэш формируется через php через echo, вставляя туда контент и все это надо подгрузить в div блок на другом сайте, где стоит этот js код с InnerHTML.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Период между сообщениями больше года.
05.08.2019, 18:42
    #39845540
Дмитрий-(сколько-же-нас?)
Дмитрий-(сколько-же-нас?)
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Что-то стиль не подхватывает в innerHTML
Хм-м-м...
Стили, вроде подхватываются.
С таймингом что-то не так...
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
  1  все
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Что-то стиль не подхватывает в innerHTML / 25 сообщений из 26, страница 1 из 2
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение
созд. / загр.: 416ms
Закрыть
start [/forum/topic.php?fid=22&mobile=1&tid=1443696]:
 0ms
get settings:
 11ms
get forum list:
 14ms
check forum access:
 4ms
check topic access:
 4ms
track hit:
 67ms
get topic data:
 8ms
get forum data:
 2ms
get page messages:
 62ms
get tp. blocked users:
 1ms
others: 243ms
total:  416ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]