VPF::Обработка стиля дочернего элемента

Vermaxt

Дата 18.10.2009, 12:06 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

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

Репутация: нет
Всего: нет

Код примерно такого содержания
HTML разметка

Код


<ul>
    <li><a href="#" onMouseOver="changer(this)">Меню</a>
        <ul>
            <li><a href="#">Подменю</a></li>
            <li><a href="#">Подменю</a></li>
        </ul>
    </li>
</ul>

/===========================================/
js сценарий

Код


function changer(element){
    var child = element.firstChild;
    child.style=(child.style=='none') ? 'block' : 'none';
}

Думаю что все поняли что это раскрывающееся меню. Дак вот...вроде все делаю правильно...но почему то не работает. В чем ошибка подскажите?

Это сообщение отредактировал(а) Vermaxt - 18.10.2009, 12:08

Kevin

Дата 18.10.2009, 12:45 (ссылка)

(нет голосов)

Загрузка ...

Новичок

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

Репутация: нет
Всего: 2

Вместо

Код

var child = element.firstChild;

должно быть:

Код

var child = element.parentNode.getElementsByTagName('ul').item(0);

Ибо Вам необходимо не «детей» искать, а «братьев» ;-)

Vermaxt

Дата 18.10.2009, 13:01 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

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

Репутация: нет
Всего: нет

Все работает спасибо...но вот только я не понимаю... ul же будет являться ребенком li...и по идее его надо скрывать или показывать...

Vermaxt

Дата 18.10.2009, 13:20 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

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

Репутация: нет
Всего: нет

аааа все понял понял понял)))))

Добавлено через 6 минут и 40 секунд
А вот почему этот код не работает

Код


var child = element.nextSibling;

Ну я имею ввиду если определять вот так братский элемент))

Kevin

Дата 18.10.2009, 13:55 (ссылка)

(нет голосов)

Загрузка ...

Новичок

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

Репутация: нет
Всего: 2

Потому что он находит перенос строки и отступ.
Надо проверять полученный объект с помощью nodeType
и искать брата, пока nodeType не будет равен 1.

UPD: Если не понятно, то вот пример:

Код

var child = element.nextSibling;
while (child.nodeType != 1) {
    child = child.nextSibling;
}

Это сообщение отредактировал(а) Kevin - 18.10.2009, 14:02

Vermaxt

Дата 18.10.2009, 14:07 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

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

Репутация: нет
Всего: нет

Все разобрался)) Спасибо!!

Kevin

Дата 18.10.2009, 14:11 (ссылка)

(нет голосов)

Загрузка ...

Новичок

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

Репутация: нет
Всего: 2

Еще надо будет не забыть проверить
существование child-a (child != null),
а то работа скрипта прервется
из-за ошибки, если обратиться к тому,
что не найдено ;-)

Это сообщение отредактировал(а) Kevin - 18.10.2009, 14:11

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »