HTML5 - DOM част 1

The СЛЪНЦЕ който се отнася до Обект модел на документТова не е нищо повече от обектно представяне на елементите, които са в нашия HTML документ, благодарение на това можем да направим по -дълбока връзка с Javascript и той постига много интересни ефекти; За да стигнем до това ниво обаче, първо трябва да знаем много добре как да се справим в рамките на DOM за неговото прилагане и използване.
Разбиране на DOM
Разширяване на концепцията за СЛЪНЦЕ Можем също така да добавим, че това е колекция от обекти, която представлява HTML В документа в името му виждаме какво представлява модел и ключовата дума, която представлява, е представителен модел на HTML документа.
DOM е ключов инструмент в WEB разработката, тъй като ни осигурява мост между структурата и съдържанието между нашите HTML и Javascript документи.
Моделът, за който говорим, се създава от браузъра, когато интерпретира HTML кода, основната структура на DOM може да се види по следния начин в диаграма на следното изображение:

Както виждаме, той се основава на йерархична структура, с което постигаме, че можем да използваме пътищата на тези отношения, за да получим информация или да направим структурни промени чрез Javascript.
Тестване на DOM
Ще извършим няколко прости теста върху нашия документ, за да свикнем как можете да работите с него. СЛЪНЦЕ, един от първите тестове, които можем да извършим, е да проверим дали в документа е налична функционалност, нека видим в следния код:

 Пример
Има много различни видове плодове - има само над 500 сорта банани. Докато добавим безбройните видове ябълки, портокали и други добре познати плодове, ние сме изправени пред хиляди възможности за избор. 

Тук направихме нещо просто, първо проверяваме дали методът съществува querySelectorAll, ако съществува, тогава на променлива присвояваме съдържанието на всички елементи img те имат идентификационния номер paratext, тъй като правим проверка в случай на неуспех, използваме различен начин за получаване на същите данни, в този случай това е getElementById и по-късно getElementByTagNameВ крайна сметка, просто с нашата дефинирана променлива, ние преглеждаме съдържанието й и променяме техните CSS свойства.
Може би тук отрицателното, което можем да видим, е, че ако имаме много проверки, нашият код може да стане сложен и нечетлив, всичко е въпрос на компромиси между това, което искаме да постигнем, и начина, по който да го постигнем, по този начин можем да получим нашите резултати.
В следващата част на този урок ще разгледаме някои по -напреднали примери за това как да продължите да работите с DOM.Хареса ли ви и помогнахте на този урок?Можете да възнаградите автора, като натиснете този бутон, за да му дадете положителна точка