# Tagesabhängige Div-Inhalte Schalten



## t.kobler (14. Mai 2020)

Hallo Liebes Forum,

ich möchte in einer Html Seite Uhrzeitabhängige Begrüßung und dazu noch <div - Elemente schalten.

Der Quelltext html sieht folgendermaßen aus:


```
<html><head><title> Guten Morgen</title><link rel="stylesheet" href="style.css"
    <script language="JavaScript" type="text/javascript" src="tageszeit.js"></script>
    </head>
<body>
    <h1>Sriptüberschrit-Morgen-Mittag-Abend</h1>
<div id="morgen" hidden>
<iframe src="morgen.pdf" width="50%" height="50%">
</iframe>
</div>
<div id="mittag" hidden>
<iframe src="mittag.pdf" width="50%" height="50%">
</iframe>
</div>
<div id="abend" hidden>
<iframe src="abend.pdf" width="50%" height="50%">
</iframe>
</div>
</body></html>
```

Die .JS Datei:


```
function Tageszeit(){
var datum = new Date()
var stunde = datum.getHours()
gruss = "Hallo Welt"
if (stunde < 8)
gruss = "Guten Morgen, folgende Dinge bedürfen deiner Aufmerksamkeit:"
show_elements(morgen)
if (8 < stunde <17 )
gruss = "Hallo"
show_elements(mittag)
if (stunde > 17)
gruss = "Guten Abend"
show_elements(abend)
}
Tageszeit();
```

Die Begrüßung funktionierte mit document.write noch relativ gut. allerdings wie bringe ich die Begrüßung zur Überschrift?
und des weiteren sollte zu jeder if (stunde....
der entsprechende div bereich freigeschaltet werden.
mit einem link "OnCLick" funktionierte das ja ganz gut - 
`<img src="morgen.png" onclick="document.getElementById('morgen').style.display=document.getElementById('morgen').style.display=='block' ? 'none' : 'block';" alt="" border="" height="50px" width="50px"/>`
nur wie verbaue ich das in meiner tageszeit.js.

Ich würde mich freuen wenn ihr mir weiterhelfen könnt.
schöne Grüße


----------



## mihe7 (14. Mai 2020)

t.kobler hat gesagt.:


> Die Begrüßung funktionierte mit document.write noch relativ gut. allerdings wie bringe ich die Begrüßung zur Überschrift?




```
document.querySelector('h1').innerText = gruss;
```



t.kobler hat gesagt.:


> und des weiteren sollte zu jeder if (stunde....
> der entsprechende div bereich freigeschaltet werden.


Ich würde nur ein div verwenden und die Inhalte je if festlegen. In deinem Fall unterscheidet sich der Spaß sowieso nur im Dateinamen, so dass Du das einfach in eine Funktion ausgliedern kannst.

So in etwa (Achtung, kann Fehler enthalten) könntest Du den betreffenden iframe zum gegebenen parent-Element hinzufügen: 

```
function addIframe(parent, src) {
     const iframe= document.create("iframe");
     iframe.src= src;
     iframe.width = "50%";
     iframe.height = "50%";
     parent.innerHTML='';
     parent.appendChild(iframe);
}
```


----------



## MoxxiManagarm (14. Mai 2020)

Vielleicht solltest du erstmal Klammern setzen.


```
if (stunde < 8)
gruss = "Guten Morgen, folgende Dinge bedürfen deiner Aufmerksamkeit:"
show_elements(morgen)
```
Nur die erste Zeile gehört zur Bedingung


----------



## t.kobler (16. Mai 2020)

danke für die Antworten ich werde versuchen, dass so einztubauen


----------

