Datum & Uhrzeit - Website X5 Helpsite

Logo Schriftzug
Logo WSX5
Newsletter anmelden
Scan QR or Download Android App

Direkt zum Seiteninhalt

Datum & Uhrzeit

Scripte > Daytime

Datum und Uhrzeit mit Javascript oder PHP

Eine kleine Skriptsammlung für die Ausgabe von Datum und Uhrzeit bzw. in Kombination in verschiedenen Skriptsprachen (PHP und JavaScript). Alle hier gezeigten Funktionen sind nur teilweise formatiert. Es gibt verschiedene Möglichkeiten der Gestaltung in Farbe und Form mit CSS. Die entsprechenden Formatierungen zur Anpassung an die Homepage erfolgen meist im HTML-Code selbst. Erfahrene Nutzer können sämtliche Javascript- und CSS-Code in ein separate Dateien auslagern und im Head-Bereich einbinden:
<script src="folder/file.js"></script> bzw. <link rel="stylesheet" href="folder/file.css" />
Einige Funktionen benötigen zwingend einen Startcode im Body-Tag <body onload"...">.
HTML-Code einfach kopieren und an gewünschter Stelle im Body-Bereich <body>.....</body> einfügen.
Bitte beachten:
Dateien, in denen ein PHP-Code ausgeführt wird, müssen zur Ausführung der Funktion die Dateiendung .php aufweisen.

Download Button

Kalender mit Hintergrund-Bildatei:
(PHP)


Saturday
26
zum Skript:
Link Mini Kalender

Monatsanzeige:
(Javascript)


Bild des Monats
im Jahre
zum Skript:
Link Monatsanzeige

Einfache Datumsausgabe:
(Javascript)


Code für den <BODY> Bereich
<div style="color: #000; font-size: 14px;">
<script>
document.write(
new Date()
.getDate()+"."+(new Date()
.getMonth()+1)+"."+new Date()
.getFullYear()
)
</script>
</div>

Datumsausgabe mit Wochentag:
(Javascript)


Code für den <BODY> Bereich
<div style="color: #000; font-size: 14px;">
<script>
var W = new Array('So','Mo','Di','Mi','Do','Fr','Sa','So'),
H=new Date(),
E=new Array(
"Januar","Februar","März","April","Mai","Juni","Juli",
"August","September","Oktober","November","Dezember"
);
document.write(
W[H.getDay()]
+"., "+H.getDate()
+". "+E[H.getMonth()]
+" "+H.getFullYear()
)
</script>
</div>

Datum im Textarea:
(Javascript)


Code für den <BODY> Tag
onLoad="Obj78_2();"

Wer nicht mit Website X5 arbeitet:
<body onLoad="Obj78_2();">
Code für den <BODY> Bereich
<div>
<script>
function Obj78_2() {
var Heute = new Date();
var Tag   = Heute.getDate();
var Monat = Heute.getMonth()+1;
var Jahr  = Heute.getFullYear();
document.Obj78_2a.Obj78_2b.value= Tag + "." + Monat + "." + Jahr;
}
</script>
<form name="Obj78_2a">
<input type="text" name="Obj78_2b" size="7"
style="color: #000; font-size: 14px; text-align: center;">
</form>
</div>

Datum im Textarea mit Button:
(Javascript)


Code für den <BODY> Bereich
<div>
<script>
function Obj78_3() {
var Heute = new Date();
var Tag   = Heute.getDate();
var Monat = Heute.getMonth()+1;
var Jahr  = Heute.getFullYear();
document.Obj78_3a.Obj78_3b.value= Tag + "." + Monat + "." + Jahr;
}
</script>
<form name="Obj78_3a">
<input type="text" name="Obj78_3b" size="7"
style="color:#000; font-size:14px;">
<input type="button" value="Zeige Datum" onClick="Obj78_3()"
style="color:#000; font-size:14px;">
</form>
</div>

Datumausgabe im PopUp-Fenster:
(PHP)


Code für den <BODY> Bereich
<div>
<input type="button" value="Datum jetzt anzeigen"
style="color: #000; font-size: 14px; text-align: center;"
onClick="alert('<?php echo date("d.m.Y"); ?>')" >
</div>

Einfache Datumsausgabe:
(PHP)


26.09.2020
Code für den <BODY> Bereich
<div style="color: #000; font-size: 14px;">
<?php $datum = date("d.m.Y"); echo $datum; ?>
</div>

Datum mit Uhrzeit:
(Javascript)


Code für den <BODY> Bereich
<div style="color: #000; font-size: 14px;">
<script>
var d=new Date();
document.write(d.toLocaleString());
</script>
</div>

Einfache farbige Uhrzeit:
(Javascript)


00:00:00

Code für den <BODY> Bereich
<div align="left">
<p style="color: #000; font-size: 14px; font-weight: bold;
width: 100px; background-color: yellow; text-align:center;"
id="Timer">00:00:00
</p>
<script>
window.setTimeout("Obj78_4()", 0);     // Sofort starten
window.setInterval("Obj78_4()", 60);   // Aktualisierung jede Sekunde
function Obj78_4() {
document.getElementById("Timer").firstChild.nodeValue =
new Date().toTimeString().substring(0, 8);
}
</script>
</div>

Uhrzeit im Textarea:
(Javascript)


Code für den <BODY> Bereich
<div>
<script>
function Obj78_5() {
var Heute = new Date();
var Stunde  = Heute.getHours();
var Minute  = Heute.getMinutes();
var Sekunde = Heute.getSeconds();
document.Obj78_5a.Obj78_5b.value= Stunde + ":" + Minute + ":" + Sekunde;
window.setTimeout('Obj78_5()',1000);
}
</script>
<form name="Obj78_5a">
<input type=text name="Obj78_5b" size="7"
style="color: #000; font-size: 14px; text-align: center;">
</form>
</div>

Uhrzeit im Textarea mit Button:
(Javascript)


Code für den <BODY> Bereich
<div>
<script>
function Obj78_6() {
var Heute = new Date();
var Stunde  = Heute.getHours();
var Minute  = Heute.getMinutes();
var Sekunde = Heute.getSeconds();
document.Obj78_6a.Obj78_6b.value= Stunde + ":" + Minute + ":" + Sekunde;
window.setTimeout('Obj78_6()',1000);
}
</script>
<form name="Obj78_6a">
<input type="text" name="Obj78_6b" size="7"
style="color: #000; font-size: 14px; text-align: center;">
<input type="button" value="Zeige Uhrzeit" onClick="Obj78_6()"
style="color:#000; font-size:14px;">
</form>
</div>

Einfache Uhrzeitausgabe:
(PHP)


05:28 Uhr
Code für den <BODY> Bereich
<div style="color: #000; font-size: 14px;">
<?php $uhrzeit = date("H:i"); echo $uhrzeit," Uhr"; ?>
</div>

Datum- und Uhrzeitausgabe:
(Javascript)


Code für den <BODY> Tag
onLoad="Obj78_7();"

Wer nicht mit Website X5 arbeitet:
<body onLoad="Obj78_7();">
Code für den <BODY> Bereich
<div>
<script>
function Obj78_7() {
zeit=new Date();
document.Obj78_7a.Obj78_7b.value=zeit.toLocaleString();
window.setTimeout("Obj78_7();",800);
}
</script>
<form name="Obj78_7a">
<input type="text" name="Obj78_7b" value="" size="15"
style="color: #000; font-size: 14px; text-align: center;">
</form>
</div>

Textarea mit Button:
(Javascript)


Code für den <BODY> Bereich
<div>
<script>
function Obj78_8() {
zeit=new Date();
document.Obj78_8a.Obj78_8b.value=zeit.toLocaleString();
window.setTimeout("Obj78_8();",800);
}
</script>
<form name="Obj78_8a">
<input type="text" name="Obj78_8b" value="Guten Tag ..." size="15"
style="color: #000; font-size: 14px; padding-left: 2px;">
<input type="button" value="zeige" onClick="Obj78_8()"
style="color: #000; font-size: 14px;">
</form>
</div>

Einfache Datum/Uhrzeitausgabe:
(PHP)


26.09.2020 - 05:28 Uhr
Code für den <BODY> Bereich
<div style="color: #000; font-size: 16px;">
<?php
$datum = date("d.m.Y"); $uhrzeit = date("H:i");
echo $datum," - ",$uhrzeit," Uhr";
?>
</div>

Anzeige im amerikanischen Format:
(PHP)


September 26, 2020, 5:28 am
Code für den <BODY> Bereich
<div style="color: #f00; font-size: 16px;">
<?php
$heute = date("F j, Y, g:i a"); echo $heute;
?>
</div>

Einfache Uhrzeit im Flash-Format:
(Flash)


Code für den <BODY> Bereich
<object
classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0"
width="80"        // Breite der Uhr
height="40"       // Höhe der Uhr
id="Obj78_9">     <!-- Objekt ID -->
<param name="allowScriptAccess" value="sameDomain" />
<!-- Farbe der Uhrzeit -->
<param name="movie" value="folder/wsX5Obj78_uhr.swf?m_Farbe=ffffff" />
<param name="quality" value="high" />
<param name="bgcolor" value="#0000ff" />         <!-- Hintergrundfarbe -->
<embed
src="folder/wsX5Obj78_uhr.swf?m_Farbe=ffffff"  // Farbe der Uhrzeit
quality="high"
bgcolor="#0000ff"                              // Hintergrundfarbe
width="80"                                     // Breite der Uhr
height="40"                                    // Höhe der Uhr
name="Obj78_9"                                 // Objekt ID
allowScriptAccess="sameDomain"
type="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/go/getflashplayer"
/>
</object>
<!-- Pfade, Farben und Darstellungsmaße anpassen, Schreibweise beachten -->
<!-- Adobe Flashplayer Plugin muss installiert und aktiviert werden! -->

Download der Flash-Datei "wsX5Obj78_uhr.swf", Pfade  (folder) im Code entsprechen anpassen.

Anzeige Kalenderwoche:
(Javascript)


Code für den <BODY> Bereich
<div style="color: #000; font-size: 14px;">
<script>
var _alleTage = 0;
var _heute = new Date();
var _Tage = new Array(12);
_Tage[0] = 31;
_Tage[2] = 31;
_Tage[3] = 30;
_Tage[4] = 31;
_Tage[5] = 30;
_Tage[6] = 31;
_Tage[7] = 31;
_Tage[8] = 30;
_Tage[9] = 31;
_Tage[10] = 30;
_Tage[11] = 31;
if (Math.round(_heute.getFullYear()/4) == _heute.getFullYear()/4) {
_Tage[1] = 29
}
else {
_Tage[1] = 28
}
if (_heute.getMonth() == 0) {      
_alleTage = _alleTage + _heute.getDate();
}
else {
var curMonth = _heute.getMonth();
for (var count = 1;
count <= curMonth; count++) {
_alleTage = _alleTage + _Tage[count - 1];
}
_alleTage = _alleTage + _heute.getDate();
}
var woche = Math.round(_alleTage/7+1);
document.write("<b>Kalenderwoche:</b> " + woche);
</script>
</div>
Weitere Scripte findest Du unter Analog Uhren, Digital Uhren und Mini Kalender.
Feedbacks zu ""

Maria Winkelmann

04.07.2018, 10:42

+0 -0  

Tolle Seite!
Allerdings benötige ich die Anzeige eines Datums, dass täglich genau 18 bzw. 65 Jahre in der Vergangenheit liegt.
Ist so etwas möglich?

Peter

05.12.2017, 13:25

+0 -0  

Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite Tolle Seite

Jakob Borda

25.09.2017, 20:36

+0 -0  

Bei mir funktioniert die Kalenderwoche leider nicht.

Eventuell hast Du Probleme mit den Zeilenumbrüchen. Javascript ist da sehr pinglig.
Ich habe Dir nochmals auf der Testseite den kompletten Code mit Textformatierungsmöglichkeit eingefügt. Diesen bräuchtest Du nur kopieren und als HTML-Objekt einfügen.
Oder kein Javascript installiert/aktiviert: http://www.x5forum.home-wiekau.de/wsx5obj96.php
Falls noch Fragen, einfach melden (nur E-Mail).

Anderas Kroitzsch

30.01.2017, 10:54

+0 -0  

Vielen Dank für diese schöne Zusammenstellung, sehr hilfreich!

Fabian Gschwenter

20.07.2016, 12:12

+0 -0  

Danke für eure super Uhren!!!! Hat mir wirklich sehr geholfen!

Prima, freut mich.

Bitte Dein Feedback

Du wirst als User bei Deinem ersten Kommentar automatisch registriert und musst dies noch bestätigen.
Erstellen Dir ein Konto, damit Deine Kommentare dann ohne Bestätigung veröffentlicht werden.

Login | Registrierung


            CAPTCHA
            Vielen Dank für Dein Feedback.
            Logo Host Europe
            Button Spenden

            © 2009 - 2020




            
            Besucher Statistik
            » 1 Online
            » 22 Heute
            » 76 Gestern
            » 586 Woche
            » 2794 Monat
            » 49755 Jahr
            » 273961 Gesamt
            Record: 1144 (01.02.2020)
            Gesamt Downloads:
            Hosting by
            Zurück zum Seiteninhalt