Hur man använder JavaScript's GetElementById för att komma åt ett specifikt element - dummies

Du kan använda JavaScript för att komma åt ett element på en HTML-sida. Du kan göra det för att göra ändringar av elementet eller till CSS-styling. Prova det i en övning.

1. Öppna textredigeraren med ett nytt eller tomt dokument.

   

2. Placera följande HTML och JavaScript i textredigeraren:

   Kapitel 2 Hej andra raden
   Detta finns i en paragraf.
   Senaste raden var theDiv = dokument. getElementById ("myDiv"); varning ("Innehållet är" + theDiv. innerHTML);
   

3. Spara filen som getbyid. html i din dokumentrots.

   

4. Öppna din webbläsare och visa sidan på // localhost / getbyid. html.

   Du bör se en varning som den som visas här.

   

5. Klicka på OK för att avvisa varningen och stänga webbläsaren.

6. Tillbaka inom getbyid. html i din editor, ta bort JavaScript-linjen som börjar med alert. Byt ut den linjen med dessa två:

   theDiv. stil. border = "3px solid black"; theDiv. innerHTML = "Detta är nu ändrad text.";
   

   Hela manusblocket ska nu se ut så här:

   var theDiv = dokument. getElementById ("myDiv"); theDiv. stil. border = "3px solid black"; theDiv. innerHTML = "Detta är nu ändrad text.";
   

   När den ses i en webbläsare ser sidan ut som den som visas här. Lägg märke till att texten på topplinjen har ändrats och nu har en gräns.