Работа с nodeType
Добрый вечер!
Подставил перед собой следующую банальную на первый взгляд задачу: подсчитать количество дочерних элементов, без знаков возврата каретки (их необходимо удалить). Как известно перевод каретки - это текстовый узел, то есть для следующей разметки: <div id="block"> <span>bla</span> <span>bla</span> <span>bla</span> </div> (здесь мы имеем 7 дочерних элементов - 3 элемента span и 4 символа перевода каретки), имеем следующий код: var childs = document.getElementById('block').childNodes, counter = 0; //количество не текстовых узлов for(var i = 0; i<childs.length; i++){ var mythis = childs[i]; (mythis.nodeType==3)? mythis.parentNode.removeChild(mythis) : ++counter; } Я получаю counter равным 0. если немного модифицировать приведенный выше код: var childs = document.getElementById('block').childNodes, counter = 0; //количество не текстовых узлов for(var i = 0; i<childs.length; i++){ var mythis = childs[i]; if(mythis.nodeType==3) mythis.parentNode.removeChild(mythis); ++counter; }, получаю counter равным 4 (то есть количество итераций), однако данный код: var childs = document.getElementById('block').childNodes, counter = 0; //количество не текстовых узлов for(var i = 0; i<childs.length; i++){ var mythis = childs[i]; if(mythis.nodeType==1) ++counter; }, работает верно и выдает counter равным 3. Объясните, пожалуйста, что я делаю не так? А также ещё вопрос: почему из цикла я не могу использовать указатель this? (приходится использовать переменную mythis) Спасибо большое за помощь! |
LeD4eG,
<div id="block"> <span>bla</span> <span>bla</span> <span>bla</span> </div> <script> var childs = document.getElementById('block').children, //childNodes counter = 0; //количество не текстовых узлов for(var i = 0; i<childs.length; i++){ //var mythis = childs[i]; (childs[i]==3)? "" : ++counter; } alert(counter+"\n"+childs.length); </script> |
то есть Вы просто заменяете пустой строкой возврат каретки?а почему с removeChild() так не выходит?
|
This - для функции, а цикл это не функция у него нет своей области видимости, все переменные в цикле видны в коде, так что mythis это простая переменная в которую записан элемент.
|
eirnvn, спасибо!понял.
|
LeD4eG, там ничего не заменяется...просто children возвращает список дочерних узлов, без текстовых
http://learn.javascript.ru/traversing-dom |
lord2kim, тогда в чём смысл проверки (childs[i].nodeType==3)?:-?
|
LeD4eG, просто показал вам, что такое children
|
а так не проще?
<!DOCTYPE HTML> <html> <head> </head> <body> <div id="block"> <span>bla</span> <span>bla</span> <span>bla</span> </div> <script> var elem = document.body.children[0]; alert(elem.children.length) </script> </body> </html> |
lord2kim,
cyber, спасибо вам за помощь с пояснением children, однако я хотел закрепить понятия childNodes и removeChild, а тут вылезла эта непонятная ситуация со счётчиком. думал тут найти ответы. |
Часовой пояс GMT +3, время: 15:03. |