Tot ce trebuie să știți despre DOM în JavaScript

Știați că putem folosi JavaScript pentru a manipula conținutul de pe pagina web? Pare interesant nu? Să înțelegem ce este Document Object Model, adică. DOM în JavaScript în modul următor:

• Ce este DOM în JavaScript?
• Acțiuni ale DOM în JavaScript
• Interogarea DOM
• Ascultarea evenimentelor
• Interacțiunea cu formularele
• Crearea elementelor HTML
• Adăugarea CSS

Ce este DOM în JavaScript?

Modelul de obiect document sau DOM este creat de browser atunci când este încărcată o pagină web. În formă grafică, este ca un arbore de elemente numite și noduri, care sunt folosite pentru a reprezenta fiecare element de pe pagină.

Tot DOM-ul paginii noastre web se află în interiorul obiectului document. Programatic, acest model ne permite să citim sau chiar să modificăm conținutul paginii noastre prin . Nu-i tare?

Acțiuni ale DOM în JavaScript

Unele dintre acțiunile pe care le putem efectua cu acest model sunt:

• Schimbați / eliminați elemente HTML din DOM / pe pagină.

• Schimbați și adăugați stiluri CSS elementelor

• Citiți și modificați atributele (href, src, alt) etc.

  
  
  

• Creați elemente noi și introduceți-le în DOM / pagină.

• Atașați ascultători de evenimente la elemente (faceți clic, apăsați tasta, trimiteți)

Interogarea DOM în JavaScript

Prinderea unui element HTML sau obținerea acestuia pentru a adăuga / modifica sau a conținutului se numește interogare.

Cod HTML:

Javascript și DOM h1 {font-size: 60px}

Cod JavaScript:

var title = document.getElementById ('title') // cgangin color to red title.style.color = 'red' var body = document.getElementById ('body') // schimbarea culorii fundalului în albastru deschis body.style. backgroundColor = 'albastru deschis'

Am schimbat culoarea textului titlului din negru în roșu folosind JavaScript. Am realizat acest lucru folosind .stil proprietatea a schimbat apoi valoarea lui culoare a egala cu net .

Acum să schimbăm culoarea de fundal a elementului corpului în albastru deschis .

Cu aceasta, ajungem la sfârșitul acestui DOM în articolul JavaScript. Sper că ați înțeles cum funcționează modelele de obiecte document și cum să implementați același DOM în JavaScript.

Acum, că știți despre DOM în JavaScript, consultați de Edureka. Instruirea pentru certificarea dezvoltării web vă va ajuta să învățați cum să creați site-uri web impresionante folosind HTML5, CSS3, Twitter Bootstrap 3, jQuery și API-urile Google și să îl implementați în Amazon Simple Storage Service (S3).

Ai o întrebare pentru noi? Vă rugăm să o menționați în secțiunea de comentarii din „DOM în JavaScript” și vă vom răspunde.

transformare căutare în exemplu informatica