Форум

viy.li · #1 (**permalink**) 14.02.2013, 12:36

Изучаю по книге Девида Макфаланда 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>

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

viy.li · #2 (**permalink**) 14.02.2013, 12:38

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

danik.js · #3 (**permalink**) 14.02.2013, 12:56

Да, все верно, есть братья - текстовая нода. Об этом не написано в книжке? И разве автор не рассказывает о 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 и работой нативных методов/свойств

danik.js · #4 (**permalink**) 14.02.2013, 13:00

рони · #5 (**permalink**) 14.02.2013, 13:16

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

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

viy.li · #6 (**permalink**) 16.02.2013, 12:04

Сообщение от danik.js

Да, все верно, есть братья - текстовая нода. Об этом не написано в книжке? И разве автор не рассказывает о 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 и работой нативных методов/свойств

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

Сообщение от danik.js

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

viy.li · #7 (**permalink**) 16.02.2013, 12:27

Сообщение от danik.js

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

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

danik.js · #8 (**permalink**) 16.02.2013, 12:51

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

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

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

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

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

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

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

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

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

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

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

рони · #9 (**permalink**) 16.02.2013, 13:24

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

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

Форум

Справочник

Discord чат

Курсы javascript