Meddelande
På gamla.pluggakuten.se kan du fortfarande läsa frågorna och svaren som ställts, men du kan inte skapa ett nytt konto eller nya trådar. Nya frågor och nytt konto skapar du på det nya forumet, välkommen dit!
Javascript och DOM
- Ibrahim15
- Medlem
Offline
- Registrerad: 2016-12-24
- Inlägg: 1
Javascript och DOM
Tjena! Tränar lite och fastnade på en sak.
Frågorna lyder
Hur hämtar jag <p> element i min dokument och länka den med klassnamnet bodyCopy som finns i min CSS?
Slutligen vad behöver jag att tänka på när jag hämtar flera element och på vilket sätt går detta igenom ?
Detta är det jag vill länka <p> tagen med
.bodyCopy {
font-family: 'Lato', sans-serif;
}
- Ingemar
- Medlem
Offline
- Registrerad: 2013-11-14
- Inlägg: 667
Re: Javascript och DOM
Ibrahim15 skrev:
Tjena! Tränar lite och fastnade på en sak.
Frågorna lyder
Hur hämtar jag <p> element i min dokument och länka den med klassnamnet bodyCopy som finns i min CSS?
Slutligen vad behöver jag att tänka på när jag hämtar flera element och på vilket sätt går detta igenom ?
Detta är det jag vill länka <p> tagen med
.bodyCopy {
font-family: 'Lato', sans-serif;
}
Det var ett tag sedan du ställde frågan utan att få ett svar. Jag antar att det beror på att du är litet otydlig i din frågeställning.
Om du vill länka P till en class finns en bra beskrivning här:
http://www.w3schools.com/cssref/sel_class.asp
Byt ut sidans-intro till din .bodyCopy så ser du hur det fungerar.
Fråga om: GE, HI, RE, SH, SV, TK, SL eller IT i grundskolan
Titta mer: http://www.grundskoleboken.se/
Jag besvarar även frågor kring betyg, åtgärdsprogram och rättigheter/skyldigheter i grundskolan
- annlu
- Medlem
Offline
- Registrerad: 2016-11-02
- Inlägg: 58
Re: Javascript och DOM
Lite sent nu kanske men tror jag förstår din fråga. Eftersom du anger JavaScript och DOM i rubriken tolkar jag det som att du vill komma åt ditt element <p> via javascriptkod, och tilldela den css-klassen bodyCopy. Kan det stämma?
För att "hitta" ditt HTML-element <p> måste du först ge den ett id: <p id="some-id"> Då kan du i din javascript komma åt <p> genom getElementById och ändra/definiera dess css-klass så här:
document.getElementById("some-id").className = "bodyCopy";
Koden ovan ger alltså samma resultat som om du hade skrivit: <p id="some-id" class="bodyCopy">
Vill du komma åt flera element (och ha samma css för flera element) måste du använda attributet class istället för id. För att ändra exempelvis följande tre element:
<p class="some-class">
<p class="some-class">
<div class="some-class">
använder du i din javascript getElementsByClassName. Du får då tillbaka en NodeList som du kan loopa igenom:
var nodelist = document.getElementsByClassName("some-class");
for (var i = 0; i < nodelist.length; i++) {
nodeList[i].classname = "bodyCopy";
}
Vill du ha kvar den ursprungliga klassen "some-class" kan du lägga till den nya klassen "bodyCopy" med:
nodeList[i].classname += " bodyCopy";
(eftersom man anger flera css klasser som en textremsa med mellansteg. Koden ovan ger alltså samma resultat som om du hade skrivit:
<p class="some-class bodyCopy">)
Info:
http://www.w3schools.com/jsref/met_docu … ntbyid.asp
http://www.w3schools.com/jsref/met_docu … ssname.asp
http://www.w3schools.com/jsref/prop_html_classname.asp