Javascript-форум - помогите с previousSibling...

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

- jQuery (https://javascript.ru/forum/jquery/)

- - помогите с previousSibling... (https://javascript.ru/forum/jquery/35545-pomogite-s-previoussibling.html)

помогите с previousSibling...

Изучаю по книге Девида Макфаланда JavaScript. И там такой пример по нахождению братских узлов. НО он не работает. Нету у <p> братьев.

Код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>новая страница</title>

<script type="text/javascript" src="jquery-1.7.2.min.js"></script>



</head>



<body>





<p id="header">Paragraf</p>







<script type="text/javascript">



var x = document.getElementById('header');

var y = x.previousSibling;

if (!y) {

alert ('данному узлу другие узлы не предшествуют!');

} else {alert ('узел существует')}

</script>





</body>

</html>

Обьясните что делать?
Может какой другой пример есть рабочий?

А пишет что есть братья...

Да, все верно, есть братья - текстовая нода. Об этом не написано в книжке? И разве автор не рассказывает о DOM-инспекторе, встроенном в каждый браузер, средствах отладки и тд? Если так, можете смело выкидывать свою книжку на помойку...

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8" />
<title>новая страница</title>

</head>

<body>

<p id="header">Paragraf</p>

<script>
    (function(){
        var x = document.getElementById('header');
        var y = x.previousSibling;
        if (!y) {
            alert ('данному узлу другие узлы не предшествуют!');
        } else {
            alert ('узел существует, nodeName:' + y.nodeName + ', nodeValue:[' + y.nodeValue + ']');
        }
        var z = x.previousElementSibling;
        if (!z) {
            alert ('данному элементу другие элементы не предшествуют!');
        }
    })();
</script>


</body>
</html>

И причем тут jQuery вообще?

Откройте для себя Firebug/Chrome Developer Tools, console.log, точки останова, DOM-инспектор и тд и тп. И забейте на jQuery пока не разберетесь с самим языком javascript и работой нативных методов/свойств

viy.li,
<body>
тут у вас пустой текстовый элемент

<p id="header">Paragraf</p>

Цитата:

Сообщение от danik.js (Сообщение 233874)

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8" />
<title>новая страница</title>

</head>

<body>

<p id="header">Paragraf</p>

<script>
    (function(){
        var x = document.getElementById('header');
        var y = x.previousSibling;
        if (!y) {
            alert ('данному узлу другие узлы не предшествуют!');
        } else {
            alert ('узел существует, nodeName:' + y.nodeName + ', nodeValue:[' + y.nodeValue + ']');
        }
        var z = x.previousElementSibling;
        if (!z) {
            alert ('данному элементу другие элементы не предшествуют!');
        }
    })();
</script>


</body>
</html>

По книге автор прикрепляет библиотеку jQuery. И пишет что это свойство данной библиотеки.

Цитата:

Сообщение от danik.js (Сообщение 233875)

Эту консоль как открыть и где? Очень похоже на Хром...

Цитата:

Сообщение от danik.js (Сообщение 233874)

alert ('узел существует, nodeName:' + y.nodeName + ', nodeValue:[' + y.nodeValue + ']');

Здесь в алерте какую то билеберду выкидывает... Можно как нибудь доработать чтобы все правильно отображалось...

Цитата:

Сообщение от viy.li

И пишет что это свойство данной библиотеки

Че за бредятина? Либо ты не правильно понял, либо автор олень. Еще раз - забудь про jQuery, изучи голый JavaScript. Если конечно есть желание нормально разобраться во всем этом.

У текстовых нод nodeName равно '#text'. Хотя я не вкурсе, описано ли это стандартами. А nodeValue я в квадратные скобки взял чтобы были видны пробелы и переносы строк. Короче, все пробелы, переносы строк и просто текст, соседствующий с Элементами на самом деле находятся в текстовой ноде. Это отлично видно в DOM-инспекторе (смотри скрин).

Есть понятие Элемент (Element), есть понятие Узел (Node). Элемент наследует от Node.

Есть схожие свойства как для работы с узлами, так и с элементами:

Цитата:

Сообщение от viy.li

Эту консоль как открыть и где? Очень похоже на Хром

Да, это хром. Вкладка Elements -> справа вкладка Properties

В консоли есть автозавершение, очень полезно поиграться в ней. Ставишь точку, получаешь все свойства и методы объекта.

Походу книжка твоя - шлак. Народ, посоветуйте чего дельного почитать.

viy.li,
чтобы всё работало напишите теги слитно

<body><p id="header">Paragraf</p>