Vet vad skillnaden mellan ID och Class är men när ska man egentligen använda vad och spelar det verkligen någon roll? Brukar oftast bara använda Class.
Vad jag förstått så är ID ett unikt element och Class kan användas på flera ställen. Man ska använda ID när det bara finns en förekomst per sida och avända klasser när det finns en eller flera förekomster per sida.
ID = A person's Identification (ID) is unique to one person.
Class = There are many people in a class
Min fråga är egentligen om det finns någon nackdel med att bara använd class rakt av. Man vet ju inte senare om man måste använda något flera gånger och då måste man ändra från ID till Class.
Du kan i princip köra class rakt av. Men det KAN innebära problem och/eller extra jobb längre fram när du faktiskt vill formatera ett enda element på en sida.
Men ett id har även andra egenskaper än att vara unikt. Det är t.ex. mer specifikt och "övertrumfar" class, det används i javascripter och i server-sidespråk som ASP och PHP och det identifieras snabbare i DOM än class.
Jag använder mig bara av id nästan bara för att hitta den snabbare i DOM-en istället för att söka ifrån document, om jag vill göra något med a-element i ett dokument och jag vet att det är en meny som skall ha ett unikt beteende så sätt id på menyn så att du kan hämta upp alla a-element ifrån den.
Att den heter .main-navigation eller #main-navigation i en CSS mall spelar mindre roll, förutom att i praktiken så skulle du kunna ha fler element med klassen main-navigation, men i CSS och HTML så kan du ha fler element med samma ID också, kommer inte validera eller ge dig ett bra resultat när du börjar jobba mot Javascript, men webbläsaren kommer sätta styles på båda dina #main-navigation.
För enbart CSS så funkar det alldeles utmärkt med bara class. :)
Id's är typ programmerarens motsvarighet till "singletons". Det kan/ska bara finnas en instans av ett id i dokumentet. Detta betyder att det inte finns något sätt att återanvända det, det är en 1 - 1 relation, och en css-fil som innehåller en mängd kod som bara kan användas en gång svämmar lätt över.. och det är aldrig bra med bloatade CSS-filer. §e
Detta är faktiskt ett ämne som diskuteras, och har diskuterats flitigt, i "webbsvängen" ett tag nu, och merparten verkar pratar varmt om att bara använda class för style, och id för JavaScript.
Måste dock nämna, när vi ändå är på ämnet.. att en viktig sak att ta i beaktning dock är att förstå hur webbläsare läser dina selektorer.
Här finns mycket "tid" att vinna i webbsidan rendering, och här har id en liten lite liten liten fördel gentemot class när det kommer till performance.
Jo, selektorer ja.. en webbläsare läser nämligen dina selektorer från höger till vänster, vilket exeplifierat innebär att följande CSS .main-navigation ul li a {..} läses som;
Lokalisera alla <a> i dokumentet.
Kontrollera vilka av dessa <a> som har en <li> som förälder i något led.
Kontrollera vilka av dessa <li> som har en <ul> som förälder i något led.
Kontrollera vilka av dessa <ul> som har ett element med classen .main-navigation som förälder i något led.
Fortsätt traversera upp till <html>.
Så där, nu vet webbläsaren vilka <a> som min style ska appliceras på.
Om man dock bara anger en selektor, ex #main-navigation {..} så lokaliserar webbläsaren den fortare eftersom det bara ska finnas ett id per dokument, och webbläsaren kan således applicera din style fortare.
Dock räcker det med att man lägger till ett element till i selektorn så är hela vinsten borta.
Skulle man ranka performance på selektorer skulle man kunna säga:
#main-navigation {..}
.main-navigation {..}
Längre selektorer..
Nu kom jag visst bort från själva ämnet lite, hehe. :stud
Men anyhow.. själv använder jag främst och mest classer för style. Id's använder jag främst som referens för att hoooka på olika JavaScript-funktioner.
Jag tycker det är mycket enklare att utveckla, vidareutveckla och underhålla stora webbplatser när man använd en class-approach.
Thats my 5 cent. :birp
272 ms totalt · 4 externa anrop · v20260731065814-full.86ec41c2