[FRAGE] Stunden + Minutenangabe im Javascript

[ritter1st]

Hallo Community ,
bisher habe ich "nur" Websites erstellt - ohne irgendwelche scripts ... oder höchstens fertige eingebaut. Jetzt habe ich mich entschlossen, mich mal mit javascript zu befassen.
Ich habe mal für den Anfang ein kleines script in eine Testseite eingebaut:

function stil() {
	if(new Date().getHours() < 12) {
		document.write(
		'<link rel="stylesheet" href="lib/css/stile1.css" type="text/css">');
	} 
	else {
		document.write(
		'<link rel="stylesheet" href="lib/css/stile2.css" type="text/css">');
	}
}

welches soweit auch funktioniert :icon6: ...
Die Testseite verändert nach 12 Uhr ihr Aussehen. Ich hab ein bisschen rumprobiert, komme aber auf keine Lösung, wenn ich z.B. die Änderungen um 12.30 Uhr haben möchte.
Wie wird das gemacht? Hab´s mit einer Variablen für die Minuten probiert, funktioniert aber alles nicht. Kann jemand helfen?
Vielen Dank, Gruß Tom

 

[Dormilich]

Was hast du denn rumprobiert?

 

[paul schmitz]

1. Code Tags (Formatiere deinen Fragepost, indem du [ CODE ] und [/ CODE ] um deinen Codeblock herumsetzt, damit er so formatiert wird wie in meiner Antwort sichtbar)
2.
12:30 Uhr und später ist:
- Stundenzahl größer oder gleich 12
- Minutenzahl größer oder gleich 30, wenn Stundenzahl gleich 12
Das alles muss in die if.

if(new Date().getHours() >11 && new Date().getHours() > 12 || new Date().getMinutes() > 29)

Zur Verständlichkeit kann man das ganze so schreiben: (Eingerücktes gehört jeweils zusammen)

if(
  new Date().getHours() >11 && // Mindestens 12 Stunden
    new Date().getHours() > 12 || // Mehr als 12 Stunden: Minuten egal
    new Date().getMinutes() > 29 // Nicht mehr als 12 Stunden, aber mehr als 11: Mindestens 30 Minuten
)

3.: document.write(); sollte in diesem Fall vermieden werden. Da sich nur der Wert eines Attributes des <style>-Tags ändert, kannst du einfach den frühen Style-Link direkt im HTML haben, und in Javascript nach erfolgter Prüfung einfach ändern. Falls du noch nicht weißt, wie man das macht, schau dir document.getElementsByClassName und diesen Stackoverflow-Beitrag an.

 

[ritter1st]

Hallo paul schmitz,
vielen Dank für die Hilfe . Ich werde das mal einbauen und die Tage testen, bin gespannt, ob es funktioniert.
Wie schon geschrieben, hab ich von der Materie noch so gut wie keine Ahnung - finde sie aber sehr interessant.
Ich melde mich nächste Woche nochmal dazu.
Danke nochmal !

 

[ritter1st]

Hallo paul schmitz,
wie geschrieben, hier mal eine Meldung zum script von dir.
Es funktioniert bis 12.30 Uhr - danach schaltet es alle 30 Minuten hin und her, das sollte so nicht sein.
Ich hab das jetzt so gemacht:

var DatumZeit = new Date()
var StdAktuell = DatumZeit.getHours()
var MinAktuell = DatumZeit.getMinutes();

MinZwei  = MinAktuell < 10 ? "0" + MinAktuell : "" + MinAktuell;
StdZwei  = StdAktuell < 10 ? "0" + StdAktuell : "" + StdAktuell;

function stil() {
	
    if (StdAktuell + MinZwei >= 730 && StdAktuell + MinZwei < 2130) 
	{                                                               
		document.write(                                          
		'<link rel="stylesheet" href="lib/css/dynamische_stile1.css" type="text/css">');
	} 
	else {
		document.write(
		'<link rel="stylesheet" href="lib/css/dynamische_stile2.css" type="text/css">');
	}
}

Ist zugegebenermaßen nicht allein auf meinem Mist gewachsen ..., aber es funktioniert.
Jetzt wird das erste Design von 7.30 bis 21.30 und das andere von 21.30 bis 7.30 angezeigt.
Vielleicht ist es ja auch eine Anregung und Hilfe für andere
Wenn ich das richtig verstehe, ist die "0" in der Zeitangabe wichtig, weil sonst z.B. die 5 höher "bewertet" wird als 15 bei den Minuten (?) ( 5 > 15, 05 < 15 ) Kann dazu jemand was sagen?

 

[paul schmitz]

Da habe ich einen Fehler gemacht. Das Script muss so aussehen:

if(
  new Date().getHours() >11 && // Mindestens 12 Stunden
  (
    new Date().getHours() > 12 || // Mehr als 12 Stunden: Minuten egal
    new Date().getMinutes() > 29 // Nicht mehr als 12 Stunden, aber mehr als 11: Mindestens 30 Minuten
  )
)

Zu deiner Frage:
Stell dir vor, es ist 13:04 Uhr, und die 0 wird nicht dazugefügt.
Dann steht da:

if("13"+"4">=730&&"13"+"4"<2130)
if("134">=730&&"134"<2130)
if(134>=730&&134<2130)
if(false&&true)
if(false)

Also ist 13:04 nicht in deinem gewünschten Bereich (laut Script). Mit der Null funktioniert es:

if("13"+"04">=730&&"13"+"04"<2130)
if("1304">=730&&"1304"<2130)
if(1304>=730&&1304<2130)
if(true&&true)
if(true)