JavaScript DOM урок с пример

Съдържание:

Anonim

Какво е DOM в JavaScript?

JavaScript може да осъществи достъп до всички елементи в уеб страница, използвайки обектния модел на документа (DOM). Всъщност уеб браузърът създава DOM на уеб страницата, когато страницата се зареди. Моделът DOM е създаден като дърво от обекти като този:

Как да използвам DOM и събития

Използвайки DOM, JavaScript може да изпълнява множество задачи. Той може да създава нови елементи и атрибути, да променя съществуващите елементи и атрибути и дори да премахва съществуващи елементи и атрибути. JavaScript може също да реагира на съществуващи събития и да създава нови събития на страницата.

getElementById, innerHTML Пример

  1. getElementById: За достъп до елементи и атрибути, чийто идентификатор е зададен.
  2. innerHTML: За достъп до съдържанието на елемент.

Опитайте сами този пример:

 DOM !!! 

Добре дошли

Това е приветственото съобщение.

Технология

Това е технологичният раздел.

Пример за обработване на събития

  1. createElement: За да създадете нов елемент
  2. removeChild: Премахване на елемент
  3. Можете да добавите манипулатор на събития към определен елемент като този:
 document.getElementById(id).onclick=function(){lines of code to be executed}

ИЛИ

document.getElementById(id).addEventListener("click", functionname)

Опитайте сами този пример:

 DOM !!!