Latest web development tutorials
×

JavaScript kurs

JavaScript kurs JavaScript krótkie wprowadzenie JavaScript zwyczaj JavaScript eksport JavaScript gramatyka JavaScript oświadczenia JavaScript uwaga JavaScript zmienna JavaScript Typy danych JavaScript Przedmioty JavaScript funkcja JavaScript zakres JavaScript wydarzenie JavaScript sznur JavaScript operatorzy JavaScript porównać JavaScript If...Else JavaScript switch JavaScript for JavaScript while JavaScript Break & Continue JavaScript typeof JavaScript Typ konwersji JavaScript Wyrażenia regularne JavaScript błąd JavaScript Debugowanie JavaScript zmienny wyciąg JavaScript Tryb Strict JavaScript Zastosowanie niezgodne z przeznaczeniem JavaScript Uwierzytelnianie za pomocą formularzy JavaScript zarezerwowane słowa kluczowe JavaScript JSON JavaScript void JavaScript Kod Specyfikacja

JS funkcja

JavaScript definicja funkcji JavaScript Argumenty funkcji JavaScript wywołanie funkcji JavaScript zamknięcia

JS HTML DOM

DOM krótkie wprowadzenie DOM HTML DOM CSS DOM wydarzenie DOM EventListener DOM element

JS zaawansowane Tutorial

JavaScript Przedmioty JavaScript Number JavaScript String JavaScript Date JavaScript Array JavaScript Boolean JavaScript Math JavaScript RegExp Przedmioty

JS przeglądarka BOM

JavaScript Window JavaScript Window Screen JavaScript Window Location JavaScript Window History JavaScript Navigator JavaScript muzyka pop JavaScript Tymczasowy zdarzenia JavaScript Cookies

JS magazyn

JavaScript magazyn JavaScript test jQuery JavaScript test Prototype

JS Przykłady

JavaScript Przykłady JavaScript instancja obiektu JavaScript Przeglądarka Instancja obiektu JavaScript HTML DOM Przykłady JavaScript streszczenie

JS Reference Manual

JavaScript Przedmioty HTML DOM Przedmioty

JavaScript HTML DOM

Poprzez DOM HTML, dostęp do wszystkich elementów dokumentu JavaScript HTML.

HTML DOM (Document Object Model)

Gdy strona jest ładowana, przeglądarka stworzy Document Object Model stronę (Document Object Model).

Model DOM HTML jest skonstruowany jako drzewo obiektów:

HTML DOM drzewo

drzewa DOM HTML

Programowalny model obiektowy, JavaScript uzyskał wystarczającą zdolność do tworzenia dynamicznego HTML.

  • JavaScript może zmienić stronę dla wszystkich elementów HTML
  • JavaScript może zmienić stronę HTML wszystkich właściwości
  • JavaScript może zmienić stronę wszystkie style CSS
  • JavaScript może reagować na całej stronie imprezy

Znalezienie elementów HTML

Zazwyczaj JavaScript, trzeba manipulować elementów HTML.

Aby zrobić to, trzeba najpierw znaleźć element. Istnieją trzy sposoby, aby to zrobić:

  • Znajdź elementów HTML przez ID
  • Znajdź elementy według nazwy znaczników HTML
  • Znajdź elementy HTML, których autorem jest nazwą klasy

Znalezienie elementów HTML przez ID

Znalezienie elementów HTML w DOM Najprostszym sposobem jest użycie identyfikatora elementu.

Przykład ten znajdzie id = "intro" element:

Przykłady

var x = document.getElementById ( "intro");

Spróbuj »

Jeśli stwierdzi elementu, metoda będzie forma obiektu (x W) powraca ten element.

Jeśli element nie zostanie znaleziony, to x będzie zawierać wartość null.

Znalezienie elementów HTML autorem nazwy znacznika

Przykład ten znajdzie id = "main" elementów, a następnie szukać id = "main" pierwiastka we wszystkich <p> elementów:

Przykłady

var x = document.getElementById ( "main");
var y = x.getElementsByTagName ( "p");

Spróbuj »

Znajdź elementy HTML, których autorem jest nazwą klasy

W tym przypadku przezgetElementsByClassName funkcji znaleźć class = "intro" elementu:

Przykłady

var x = document.getElementsByClassName ( "intro");

Spróbuj »

HTML DOM Tutorial

W tym poradniku kolejnych stronach dowiesz się:

  • Jak zmienić zawartość elementu HTML (innerHTML)
  • Jak zmienić styl elementów HTML (CSS)
  • Jak wydarzeniem HTML DOM z reakcją
  • Jak dodać lub usunąć elementy HTML