[Homework] JavaScript Basics - JavaScript DOM & Events - Problem {2} - Display DIV's Content - изпълнение на кода
Здравейте,
Това е кодът ми за задачата:
http://pastebin.com/MPfEzsvp
Първият ми въпрос е - защо в примера липсва праен лист. Логично погледнато би трябвало да се отпечата нулевото съдържание и на празния HTML. Макар че това можем да го заобиколим, като пушваме елемент в листа, само ако не е празен.
Вторият ми въпрос е свързан с работата на цикъла. Явно не работи. inputs.lenght е 5. Само че поради някаква причина кодът влиза в цикъла шести път. Търси inputs[5] и след като не го намира, пушва още веднъж предния елемент Inner Div. Съответно в листа имаме един Inner Div повече. Някой има ли идея на какво се дължи и как се оправя?
Оправи се, мерси
Всъщност проблемът не е в JavaScript-a. Това е нормалното поведение. Това, което се случва е следното:
1. Взимаш всички елементи с таг <div>. Това, което ти връща фънкцията getElementsByTagName() е Live Node List. Какво означава това? Това означава че всеки пък когато се промени ДОМ дървото този Live Node List също ще отчете тази промяна. Тоест ако търсиш всички <div> елементи на страницата, всеки пък когато добавиш нов <div> дължината на този Live Node List ще се увеличава. Инфо
2. След като вземеш всички <div> елементи започваш да ги пъхаш в <li> тагове като взимаш innerHTML. Това, което ти връща innerHTML е всичко, което е вътре във всеки <div>. Какво означава това? Това значи, че когато вземеш innerHTML на <div> номер 3 получаваш следното "third div<div>inner div</div>". След като си взел това нещо го слагаш в едно <li> и ако помислиш върху 1ва точка, ще разбереш защо имаш допълнителен елемент ; )