logo

Modèle d'objet de document

  1. Objet de document
  2. Propriétés de l'objet document
  3. Méthodes de l'objet document
  4. Exemple d'objet document

Le objet de document représente l'intégralité du document html.

Lorsque le document HTML est chargé dans le navigateur, il devient un objet document. C'est le élément racine qui représente le document html. Il a des propriétés et des méthodes. À l'aide d'un objet document, nous pouvons ajouter du contenu dynamique à notre page Web.

Comme mentionné précédemment, c'est l'objet de window. Donc

 window.document 

C'est pareil que

 document 

Selon le W3C - «Le modèle objet de document (DOM) du W3C est une interface neutre en termes de plate-forme et de langage qui permet aux programmes et aux scripts d'accéder et de mettre à jour dynamiquement le contenu, la structure et le style d'un document.»


Propriétés de l'objet document

Voyons les propriétés de l'objet document auxquelles l'objet document peut accéder et modifier.


Méthodes de l'objet document

Nous pouvons accéder et modifier le contenu du document par ses méthodes.

Les méthodes importantes de l'objet document sont les suivantes :

MéthodeDescription
écrire('chaîne')écrit la chaîne donnée sur le document.
writeln('chaîne')écrit la chaîne donnée sur le document avec un caractère de nouvelle ligne à la fin.
getElementById()renvoie l'élément ayant la valeur d'identifiant donnée.
getElementsByName()renvoie tous les éléments ayant la valeur de nom donnée.
getElementsByTagName()renvoie tous les éléments ayant le nom de balise donné.
getElementsByClassName()renvoie tous les éléments ayant le nom de classe donné.

Accéder à la valeur du champ par objet de document

Dans cet exemple, nous allons obtenir la valeur du texte saisi par utilisateur. Ici, nous utilisons document.form1.nom.valeur pour obtenir la valeur du champ nom.

Ici, document est l'élément racine qui représente le document HTML.

formulaire 1 est le nom du formulaire.

nom est le nom d'attribut du texte saisi.

valeur est la propriété qui renvoie la valeur du texte saisi.

Voyons l'exemple simple d'un objet document qui imprime le nom avec un message de bienvenue.

 function printvalue(){ var name=document.form1.name.value; alert('Welcome: '+name); } Enter Name: 

Résultat de l'exemple ci-dessus

Entrez le nom: