Style i noscript-taggen?

14 svar · 532 visningar · startad av Travoni 25 sep. 2006

TravoniMedlem sedan okt. 20041 556 inlägg

Frågan25 sep. 2006 08:56#1

Detta validerar fel på w3c.

<noscript>
	<style type="text/css">
			#foo table{ display:none; }
			.bar{ display:block; }
	</style>
</noscript>

validator.w3.org skrev:

The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed).

Vilket i och för sig inte stämmer.

Dumt att det inte är godkännt. Finns det någon workaround?

@ndersMedlem sedan juni 200032 967 inlägg

25 sep. 2006 08:58#2

Lägg <style> utanför <noscript> och använd css:en inuti?

TravoniMedlem sedan okt. 20041 556 inlägg

25 sep. 2006 09:07#3

Nä, då får jag:

Line 13 column 11: end tag for element "NOSCRIPT" which is not open.

</noscript>

The Validator found an end tag for the above element, but that element is not currently open

@ndersMedlem sedan juni 200032 967 inlägg

25 sep. 2006 09:25#4

Öh, hur ser din kod ut då?

jag menade förstås att du skulle lägga hela css-blocket på någonstans som inte är inne i noscript-blocket.

TravoniMedlem sedan okt. 20041 556 inlägg

25 sep. 2006 09:39#5

Kanske gjorde fel.

	<style type="text/css">
             /* Annan CSS */
            <noscript>
			#foo table{ display:none; }
			.bar{ display:block; }
            </noscript> 
	</style>

Fel? Hur menade du?

@ndersMedlem sedan juni 200032 967 inlägg

25 sep. 2006 09:45#6

<style>
....
</style>
(typ där du har annan css-kod på sidan)

....

<noscript>
....
</noscript>

FuelMedlem sedan okt. 20001 285 inlägg

25 sep. 2006 10:50#7

...

@ndersMedlem sedan juni 200032 967 inlägg

25 sep. 2006 10:55#8

Fuel, man får alltså ha <link> var som helst, men <style> endast i <head>?

zcorpanMedlem sedan dec. 20042 245 inlägg

25 sep. 2006 11:13#9

NOSCRIPT får endast innehålla blockelement. Blockelement får man inte ha i HEAD och därför får man inte ha NOSCRIPT i HEAD heller. (LINK får endast förekomma i HEAD också.)

Det du vill göra är att ha annan CSS när JS är aktiverat. En enkel lösning på det problemet är att göra såhär:

<script type="text/javascript">
 document.body.className += " hasjs";
</script>

...och sen lägga till ".hasjs" före dina selektorer (i din vanliga stilmall) som bara ska användas när JS är aktiverat.

FuelMedlem sedan okt. 20001 285 inlägg

25 sep. 2006 14:50#10

...

TroxyMedlem sedan mars 20041 505 inlägg

25 sep. 2006 18:01#11

Jag slängde ihop ett Javascript som helt enkelt infogar ett stylesheet i ett dokument.

<script type="text/javascript">
var linkTag = document.createElement('link');
linkTag.setAttribute('rel','stylesheet');
linkTag.setAttribute('type','text/css');
linkTag.setAttribute('href','javastyle.css');
document.getElementsByTagName('head').item(0).appendChild( linkTag );
</script>

Så CSS-koden i filen javastyle.css kommer alltså bara att användas om man har Javascript aktiverat!
Blev riktigt nöjd med lösningen själv måste jag säga :i

TravoniMedlem sedan okt. 20041 556 inlägg

26 sep. 2006 10:14#12

Ok, varför inte med document.write?

<script type="text/javascript">
    docuement.write('<link rel="stylesheet" href="script.css" type="text/css" />');
</script>

MobergMedlem sedan sep. 200614 inlägg

26 sep. 2006 23:33#13

Därför att link-taggen ska hamna i head-taggen? Antar jag?

TroxyMedlem sedan mars 20041 505 inlägg

27 sep. 2006 07:08#14

Moberg, dels det, samt att det är lite modernare och bättre att koda Javascript med hjälp av DOM-metoderna.

zcorpanMedlem sedan dec. 20042 245 inlägg

27 sep. 2006 07:37#15

SCRIPT kan också förekomma i HEAD så om man lägger document.write()-skriptet i HEAD hamnar länken på rätt plats. Det är inget fel på document.write() egentligen, förutom att det inte är definierat hur det ska fungera i XML ännu (och stöds därför inte i XHTML i webbläsare än). Den praktiska skillnaden mellan DOM-skriptet och document.write()-skriptet är att det senare är lättare att skriva, stöds bättre i webbläsare och är snabbare att köra. (Om DOM-skriptet ska köras i XHTML borde man använda createElementNS() istället.)