Comment utiliser JavaScript GetElementById pour accéder à un élément spécifique - dummies

Vous pouvez utiliser JavaScript pour accéder à un élément dans une page HTML. Vous pouvez le faire pour apporter des modifications à l'élément ou au style CSS. Essayez-le dans un exercice.

1. Ouvrez votre éditeur de texte avec un document nouveau ou vierge.

   

2. Dans l'éditeur de texte, placez le code HTML et JavaScript suivant:

   Chapitre 2 Bonjour Deuxième ligne
   Ceci est dans un paragraphe.
   Dernière ligne var theDiv = document. getElementById ("myDiv"); alert ("Le contenu est" + theDiv. innerHTML);
   

3. Enregistrez le fichier en tant que getbyid. html dans votre document racine.

   

4. Ouvrez votre navigateur Web et affichez la page à l'adresse // localhost / getbyid. html

   Vous devriez voir une alerte comme celle-ci.

   

5. Cliquez sur OK pour fermer l'alerte et fermer votre navigateur.

6. Retour dans getbyid. html dans votre éditeur, supprimez la ligne JavaScript qui commence par alerte. Remplacez cette ligne par ces deux:

   theDiv. style. border = "3px noir uni"; theDiv. innerHTML = "Ceci est maintenant le texte modifié.";
   

   Le bloc de script entier devrait ressembler à ceci:

   var theDiv = document. getElementById ("myDiv"); theDiv. style. border = "3px noir uni"; theDiv. innerHTML = "Ceci est maintenant le texte modifié.";
   

   Lorsqu'elle est affichée dans un navigateur, la page ressemble maintenant à celle montrée ici. Notez en particulier que le texte de la ligne supérieure a été modifié et a maintenant une bordure.