значение свойства display

[ed101utf8]

Доброго времени суток

Столкнулся с особенностью.

f

unction collapse(elem){
var block=document.getElementById(elem);

if(block.style.display=='none')
		{
			block.style.display='block';
		}	else
			{
				block.style.display='none';	
			}
}

Проблема - при первом обращении к этой функции значение block.style.display="" - т.е. пустой строке. А как этого избежать? Т.е. что бы при первом обращении можно было узнать чему в действильности оно равно - 'display' или 'none'

[Searcher]

Да, есть такая особенность, свойства объекта не видны из JS. Только если сам JS их устанавливает. Есть варианты решения.

1. Вобщем-то при загрузке страницы в большинстве случаев в css вы же и устанавливаете значение этого свойства, так что понять что означает первичное значение block.style.display="" очень просто.

2. Для пущей надежности установить через JS это свойство в первоначальное положение при загрузке.

3. Есть замечательное свойство getComputedStyle, с его помощью можно решить вашу проблему универсально.

[Great Rash]

А совсем хорошо будет сделать как описано тут

[ed101utf8]

Расскажите пожалуйста, чем одинарные кавычки отличаются от двойных:

function show(el) {
	if (getRealDisplay(el) != 'none') return // (1)
	el.style.display = el.getAttribute("displayOld") || "" // (2)

Что такое || "" (две вертикальные линии вроде бы операция ИЛИ, но все равно не пойму как работает)

el.getAttribute("displayOld")  ||  ""

Что означают три знака равно ===

 if (display === "none" )

function show(el) {
04
	if (getRealDisplay(el) != 'none') return // (1)
05

06
	el.style.display = el.getAttribute("displayOld") || "" // (2)
07

08
	if ( getRealDisplay(el) === "none" ) { // (3)
09
		var nodeName = el.nodeName, body = document.body, display
10

11
		if ( displayCache[nodeName] ) { // (3.1)
12
			display = displayCache[nodeName]
13
		} else { // (3.2)
14
			var testElem = document.createElement(nodeName)
15
			body.appendChild(testElem)
16
			display = getRealDisplay(testElem)
17

18
			if (display === "none" ) { // (3.2.1)
19
				display = "block"
20
			}
21

22
			body.removeChild(testElem)
23
			displayCache[nodeName] = display
24
		}
25

26
		el.setAttribute('displayOld', display)  // (3.3)
27
		el.style.display = display
28
	}
29
}

[Great Rash]

Расскажите пожалуйста, чем одинарные кавычки отличаются от двойных:

В JavaScript ничем, в других языках (например в PHP) отличаются.

Что такое || "" (две вертикальные линии вроде бы операция ИЛИ, но все равно не пойму как работает)

Это один из вариантов записи дефолтного значения. В JavaScript при записи значений переменной через || (ИЛИ) переменная примет первое значение равное true. Например:

var f = false;
var t = true;

var x = f || t;
alert(x); // true

var a = 0;
var b = 2;

x = a || b;
alert(x); // 2 (так как 0 приравнивается к false)

Что означают три знака равно ===

Три знака равно это сравнение без приведения типов. Т.е. если я буду сравнивать вот так == программа сначала приведет данные к некоему общему типу, а потом их сравнит, а если написать ===, то приведения типов не будет. Это иногда очень полезно, попробуйте запустить следующий код:

alert(0 == false); // выдаст true (т.к. произошло приведение к некоему общему типу данных)
alert('' == false); // выдаст true
alert('' == 0); // выдаст true

alert(0 === false); // выдаст false (т.к. типы данных разные)
alert('' === false); // выдаст false
alert('' === 0); // выдаст false

Кроме того, такая операция сравнения происходит вроде как быстрее (самолично не проверял, но читал где-то).