Javascript-форум - Свойство style не работает?

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

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Свойство style не работает? (https://javascript.ru/forum/misc/22825-svojjstvo-style-ne-rabotaet.html)

Свойство style не работает?

Вопрос наверно элементарный, но уже мозг сломал об него...(

Если в ХТМЛ стили задать непосредственно т.е. внутри тэга через style="..."

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

<head>

<script type="text/javascript">

function MyFunc()

{

alert(document.getElementById('test1').style.color);

alert(document.getElementById('test1').style.backgroundColor);

}

</script>

</head>

<body onload="MyFunc()">

<div id="test1" style="color:#123456; background-color:#000000;">test</div>

</body></html>

то в javascript вызовы

Код:

alert(document.getElementById('test1').style.color);

alert(document.getElementById('test1').style.backgroundColor);

выводят как надо, #123456 и #000000.

но если стили задать через тэг STYLE

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html><head>

<style type="text/css">

.qwerty {color:#123456; background-color:#000000;}

</style>

<script type="text/javascript">

function MyFunc()

{

alert(document.getElementById('test1').style.color);

alert(document.getElementById('test1').style.backgroundColor);

}

</script>

</head>

<body onload="MyFunc()">

<div id="test1" class="qwerty">test</div>

</body></html>

то обращения к style.color и т.п. дают почему-то пустые строки. ((

Цитата:

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

о обращения к style.color и т.п. дают почему-то пустые строки.

Может быть потому, что в атрибуте style ничего не указано?
window.getComputedStyle

Спасибо, getComputedStyle работает =)

Теперь еще интересный момент, уже чисто для интереса. Если задать составной стиль

<style type="text/css">
.qwerty{ border: 3px #8080ff solid;}
</style>

и вывести все его свойства через for (var key in computedStyle)
получаем следущее (для border)

border =
borderCollapse = separate
borderColor =
borderSpacing = 0px 0px
borderStyle =
borderTop =
borderRight =
borderBottom =
borderLeft =
borderTopColor = rgb(128, 128, 255)
borderRightColor = rgb(128, 128, 255)
borderBottomColor = rgb(128, 128, 255)
borderLeftColor = rgb(128, 128, 255)
borderTopStyle = solid
borderRightStyle = solid
borderBottomStyle = solid
borderLeftStyle = solid
borderTopWidth = 3px
borderRightWidth = 3px
borderBottomWidth = 3px
borderLeftWidth = 3px
borderWidth =

то есть значения "раскидываются" по "элементарным" стилям типа borderLeftWidth, а составные стили - пустые. В принципе про эту фишку упомянуто в описании getComputedStyle

...Стоит отметить, что с помощью currentStyle нельзя получить значения для "составных" CSS свойств, которые перечисляют свойства через пробел...

но тогда не понятен смысл, зачем в списке стилей выдаются все эти borderWidth и borderColor, если они всегда пустые будут...

Цитата:

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

зачем в списке стилей выдаются все эти borderWidth и borderColor

Потому что они там есть. :D Ты же сам дал команду

for (var key in computedStyle)

Вот тебе и вывели все (!) ключи объекта и их значения...

Да это понятно что они там есть, и for-in выводит все потроха объекта )) вопрос нафига они там есть, если все равно всегда пустые будут, как я понял...

Цитата:

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

вопрос нафига они там есть

Для того, чтобы можно было им что-то присвоить...

Цитата:

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

все равно всегда пустые будут

От того, что они не нужны тебе не значит, что они никому не нужны...

Ведь ты много чем не пользуешся в жизни... Но оно таки есть! :D

Цитата:

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

Цитата:

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

вопрос нафига они там есть

Для того, чтобы можно было им что-то присвоить...

Точняг)) щас поэксперементировал еще - вроде все окончательно ясно стало)

var z = document.createElement('DIV');
z.style.border='3px #8080ff solid';

на запись вполне себе работает, стили меняются, вид странички тоже, и computedStyle тоже =)

Спасибо всем =)