Hvordan få et attributt i Javascript
Javascript gir nettstedet utvikler med midler for å vise og endre de strukturelle elementene i en webside. Javascript har innebygde funksjoner som kan få tilgang til HTML (Hypertext Markup Language) Document Object Model, eller DOM, og utsetter styling attributtene for en bestemt HTML tag.The Javascript-metoden - getElementById () - kan kikke inn en HTML-kode som er merket med en ID og avsløre attributter, for eksempel dens bakgrunn, skrifttype, grenser, bredde, marginer og posisjonering.
Bruksanvisning
1 Start standard, ren tekst tekst editor program som er tilgjengelig på datamaskinen.
2 Skriv inn følgende kode inn i teksteditor.
<Html>
<Head>
<Script language = "javascript">
fungere spørre () {
Var infomytag1 = document.getElementById ( "mytag1");
Var infomytag2 = document.getElementById ( "mytag2");
document.write ( "<h2> Tag attributter for første div </ h2>");
document.write ( "Font farge er:" + infomytag1.style.color);
document.write ( "");
document.write ( "Avsnitt bredde er:" + infomytag1.style.width);
document.write ( "");
document.write ( "Skrift størrelse er:" + infomytag1.style.fontSize);
document.write ( "");
document.write ( "bakgrunnsfarge er:" + infomytag1.style.backgroundColor);
document.write ( "");
document.write ( "margin-bottom er:" + infomytag1.style.marginBottom);
document.write ( "<h2> Tag attributter for andre div </ h2>");
document.write ( "Font farge er:" + infomytag2.style.color);
document.write ( "");
document.write ( "Skrift familien er:" + infomytag2.style.fontFamily);
document.write ( "");
document.write ( "Skrift størrelse er:" + infomytag2.style.fontSize);
document.write ( "");
document.write ( "Font vekt er:" + infomytag2.style.fontWeight);
document.write ( "");
document.write ( "margin-bottom er:" + infomytag2.style.marginBottom);
}
</ Script>
</ Head>
<Body>
<Div id = "mytag1" style = "color: red; width: 10em; background-color: gul; font-size: 16px; margin-bottom: 2em"> Her er mytag1 </ div>
<Div id = "mytag2" style = "color: blue; font-family: arial; font-size: 8px; font-weight: bold; margin-bottom: 30px"> En annen Div merket "mytag2" </ div>
<INPUT TYPE = "button" onclick = "Spørre ()" value = "Klikk her for å vise kodeattributter">
</ Body>
</ Html>
3 Klikk på Fil-menyen. Velg "Lagre" alternativet. Lagre under filnavnet "test.html."
4 Start nettleseren som er tilgjengelig på datamaskinen. Klikk på "File" menyen og velg "Åpne fil".
5 Finn filen "test.html" nettopp opprettet, velger du den med musen og klikk på "Open".
6 Klikk på knappen med musen for å se de "div" tag attributter.
Hint
- Javascript er et case-sensitive språk. For eksempel funksjonene "showAllTags ()" og "ShowAllTags ()" anses å være to forskjellige funksjoner ved Javascript tolk den. Variablene er store og små bokstaver i tillegg. Men HTML er ikke store og små bokstaver. Hvis du ønsker å ringe Javascript-funksjon "showAllTags ()" med et museklikk, kan koden skrives som: onclick () = "showAllTags ()" eller onclick () = "showAllTags ()".
- Den store nettleseren vil vise gyldig HTML og CSS-kode annerledes. Selv forskjellige versjoner av den samme nettleseren kan gi uventede visningsproblemer. Test alltid koden på ulike nettlesere og eldre versjoner av den samme nettleseren for å sikre at koden fungerer som forventet.