Latest web development tutorials
×

JavaScript cours

JavaScript cours JavaScript Brève introduction JavaScript usage JavaScript exportation JavaScript grammaire JavaScript Déclarations JavaScript note JavaScript variable JavaScript Types de données JavaScript Objets JavaScript fonction JavaScript portée JavaScript événement JavaScript chaîne JavaScript opérateurs JavaScript comparer JavaScript If...Else JavaScript switch JavaScript for JavaScript while JavaScript Break & Continue JavaScript typeof JavaScript Type de conversion JavaScript expressions régulières JavaScript erreur JavaScript debugging JavaScript ascenseur variable JavaScript Strict mode JavaScript utilisation inappropriée JavaScript Authentification Forms JavaScript Mots clés réservés JavaScript JSON JavaScript void JavaScript Spécification code

JS fonction

JavaScript Définition de la fonction JavaScript Arguments de la fonction JavaScript appel de fonction JavaScript fermetures

JS HTML DOM

DOM Brève introduction DOM HTML DOM CSS DOM événement DOM EventListener DOM élément

JS Tutorial avancée

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

JS Navigateur BOM

JavaScript Window JavaScript Window Screen JavaScript Window Location JavaScript Window History JavaScript Navigator JavaScript pop JavaScript événement Timed JavaScript Cookies

JS entrepôt

JavaScript entrepôt JavaScript test jQuery JavaScript test Prototype

JS Exemples

JavaScript Exemples JavaScript instance de l'objet JavaScript instance d'objet du navigateur JavaScript HTML DOM Exemples JavaScript résumé

JS Manuel de référence

JavaScript Objets HTML DOM Objets

JavaScript HTML DOM

A travers le DOM HTML, l'accès à tous les éléments de documents HTML JavaScript.

HTML DOM (Document Object Model)

Lorsque la page est chargée, le navigateur va créer le modèle d'objet page de document (Document Object Model).

modèle DOM HTML est structuré comme un arbre d'objets:

arbre DOM HTML

arbre DOM HTML

modèle d'objet programmable, JavaScript a gagné la capacité suffisante pour créer HTML dynamique.

  • JavaScript peut modifier la page pour tous les éléments HTML
  • JavaScript peut modifier la page HTML toutes les propriétés
  • JavaScript peut changer la page tous les styles CSS
  • JavaScript peut réagir à tous page des événements

Trouver des éléments HTML

En règle générale, JavaScript, vous devez manipuler des éléments HTML.

Afin de faire cette chose, vous devez d'abord trouver l'élément. Il y a trois façons de le faire:

  • Trouver des éléments HTML par identifiant
  • Trouver des éléments HTML par nom de tag
  • Trouver des éléments HTML par nom de classe

Trouver des éléments HTML par identifiant

Trouver des éléments HTML dans le DOM Le plus simple est d'utiliser l'identifiant de l'élément.

Cet exemple recherche id = élément "intro":

Exemples

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

Essayez »

Si elle trouve l'élément, la méthode sera la forme d'objet (x dans) les renvoie cet élément.

Si l'élément ne se trouve pas, alors x contiendra null.

Trouver des éléments HTML par nom de tag

Cet exemple recherche id = "principaux" éléments, puis chercher id = élément «principal» dans tous les éléments <p>:

Exemples

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

Essayez »

Trouver des éléments HTML par nom de classe

Dans ce cas pargetElementsByClassName fonction pour trouver la classe = élément "intro":

Exemples

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

Essayez »

Tutoriel DOM HTML

Dans ce tutoriel, les pages suivantes, vous apprendrez:

  • Comment changer le contenu de l'élément HTML (innerHTML)
  • Comment changer le style des éléments HTML (CSS)
  • Comment événement HTML DOM d'une réaction
  • Comment puis-je ajouter ou supprimer des éléments HTML