27. marts 2006 - 13:35Der er
6 kommentarer og 1 løsning
ny class på element via javascript
Hej med jer...
Kan jeg via javascript lade et element få en ny class attribut? Altså istedet for at lade javascript ændre de enkelte CSS atributter een ad gangen, så bare lade elementet pege på en anden class.
I forsimplet form havde jeg håbet på noget i stil med nedenstående (men det virker så altså bare ikke): ---8<------ <html> <head> <style> #myDiv{ width:300px; height:200px; } .itsOn{ background-color:#ff3333; color:black; } .itsOff{ background-color:#330000; color:white; } </style> <script language=""> function turnElementOn(elem){ elem.class="itsOn"; }
function turnElementOff(elem){ elem.class="itsOff"; } </script> </head> <body> <div id="myDiv" class="itsOff" onmouseover="turnElementOn(this); return true;" onmouseout="turnElementOff(this); return true;">Her er en kasse!</div> </body>
</html> ---8<------
... den gider ikke æde elem.class="yadayadayada", men er der så en anden måde man kan få fat i (og ændre) class?
I lang tid har samarbejdsbranchen fokuseret på at forbedre enhedsfunktioner – bedre kameraer, klarere lyd og smartere software. Men den virkelige forvandling handler ikke om funktioner.
Jeg synes at det lyder meget underligt, hvis hele DOMen skal genberegnes fordi man ændrer en class, men at den ikke bliver genberegnet hvis man nøjes med at ændre de eksakte properties ved class'en???
De enkelte properties skal vel også nedarves??? Men ok - det er jo før set, at ting har været sært implementeret. :)
Gevinsten (og den synes jeg absolut er stor!) ved ikke at lade javascriptet ændre de enkelte properties, men istedet få elementet til at pege på en anden class er, at jeg kan holde ALT omkring layout i mit stylesheet (hvor det hører hjemme!!), istedet for at et redesign i CSS også skal involvere ændringer i mit javascript!
Gevinsten (og den synes jeg absolut er stor!) ved ikke at lade javascriptet...> Enig - jeg vidste ikke det andet og derfor kom jeg med den anden løsning (med class skifte) først i den tråd, tvivler dog på at roenving siger noget forkert... det var bare et hint til tråden intet andet :)
Noget af forklaringen på, at der er forskel på at skifte enkelte properties og className mht. genopbygning af DOM-træet er, at en af de mekanismer, der bruges ved beregningen af dette, medtager en prioritering på baggrund af, hvr mange elementer en selektor består af ...
-- f.eks. har '#mitElement td a' større prioritet end '#mitElement a', hvorfor man kan have links (i eksemplet her) i tabelceller, der har et andet udseende end dem, der ikke ligger inde i tabelceller ...
-- hvordan hele det prioriteringsskema skal ændres kan bare ved ændring af eet className være fuldstændigt uoverskueligt, hvorfor browseren simpelthen genberegner !-)
-- ved ændring af en property skal det jo kun implementeres i det aktuelle element og eventuelle underelementer, der skal cascades over !o]
Synes godt om
Ny brugerNybegynder
Din løsning...
Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.