Split-Datum und Uhrzeit in zwei Elemente

Ich habe ein Objekt, das zeigt das Datum und die Zeit Leben.

Ich würde gerne wissen, wie ich trennen kann der Teil ab dem Datum, also ich kann es in seine eigenen HTML-element, so kann ich anwenden, verschiedene styling zu es?

Ich bin nicht so weit mit JavaScript, und ich finde die Arbeit mit dem date-Objekt sehr kompliziert.

LiveDateTime.js

'use strict';

function LiveDateTime(dateEl, options) {
    this.dateEl = dateEl;
    this.options = options;

    this.timestamp;
    this.offset;

    this.start();
}

LiveDateTime.prototype = {
    start: function () {
        var now = !this.timestamp ? new Date() : new Date(this.timestamp),
            self = this;

        (function update() {
            self.dateEl.innerHTML = now.toLocaleString(self.options.locale, self.options);

            now.setSeconds(now.getSeconds() + 1);

            self.timeoutId = setTimeout(update, 1000);
        })();
    },

    stop: function () {
        clearTimeout(this.timeoutId);

        this.timeoutId = undefined;
    }
};

Nutzung

var liveDateTime = new LiveDateTime(document.getElementById('date'), {
    locale: 'FR',
    weekday: 'long',
    day: 'numeric',
    month: 'long',
    year: 'numeric',
    hour: '2-digit',
    minute: '2-digit',
    second: '2-digit'
});

//output example: vendredi 13 mars 2015 23:14:12

HTML

<span id="date"></span> - <span id="time"></span>

Prüfen Sie in momentjs. Es wird Ihr Leben viel einfacher.
Date-Objekte sind ziemlich einfach. Sie haben eine Zeitwert, der Millisekunden seit der Epoche und einen offset von system-Einstellungen. Es hat auch eine Reihe von praktischen Methoden, um Dinge zu tun, aber es nicht, die Formatierung der Werte sehr gut. Das ist das bit, wo müssen Sie vielleicht ein bisschen helfen, aber es gibt Methoden zum schreiben von Zeit und Datum (pro QuentinUK s Antwort), oder Sie können Sie formatieren Sie Sie sich selbst mit Methoden wie getHours, getMinutes, getFullYear, getMonth, etc.

InformationsquelleAutor Kid Diamond | 2015-03-13

9

Verwenden Datum.toLocaleDateString()
für das Datum Teil.

und Datum.toLocaleTimeString()
für die Zeit Teil.
- Das problem mit dem toLocale - Methoden ist, dass Sie nie wissen, was Sie bekommen werden, von host zu host. Safari & OmniWeb: 14. März 2015 Firefox: 14/3/2015, Chrom: 3/14/2015, IE: Samstag, März 14, 2015.
- Wenn Sie möchten, dass Sie würde haben, um Ihre eigene version von toLocale. Nicht einfach, wenn Sie wollen, Tage und Monate in Worte zu fassen.
- Ja, aber ich denke, das ist nur, wenn Sie nicht geben es jegliche Formatierung Optionen.
- die Formatierung Optionen sind eine aktuelle Ergänzung, es ist halt nur im IE (version 11) und nicht in Safari noch nicht.
- sind keine Formatierungsoptionen, die in der ECMA-262 ed 5 oder die ed 6 Entwurf, so wird es eine sehr lange Zeit, bevor Browsern konsistent Ihnen. So wie es da steht, ist das Ergebnis von toLocaleString ist völlig implementierungsabhängig und verschiedenen Browsern. Schreiben Sie eine Funktion zum erzeugen einer bestimmten formatieren von Datums-string ist trivial.
- ist ECMA-402, die eine standard seit Dezember 2012, aber ich sehe nicht ein, weit verbreitete Annahme. Letzte Entwurf war im letzten Monat.
InformationsquelleAutor QuentinUK

Können Sie formatieren Sie Ihre Datum mit Date zur Verfügung stehenden Methoden:

JS:

var now = new Date()
var date = now.toLocaleDateString();
var time = now.toLocaleTimeString();
alert(date + ' ' + time)

InformationsquelleAutor MaxZoom

Können Sie javascript verwenden, ist split() Methode

var date = liveDateTime.split(" ");
    var weekday = date[0];
    var day = date[1];
    var month = date[2];
    var year = date[3];
var time = date[4].split(":");
    var hour = time[0];
    var minute = time[1];
    var second = time[2];

InformationsquelleAutor Karwalski

0

Ich bin nicht so weit mit JavaScript, und ich finde die Arbeit mit dem date-Objekt sehr kompliziert.

Arbeiten mit Datum in JS könnte in der Tat kompliziert und frustrierend. Aber das könnte ein Vergnügen sein, durch die Verwendung von Bibliotheken wie momentjs

, Damit Sie das Datum formatiert, wie Sie benötigen :
```
moment().format('dddd Do MMMM YYYY'); //vendredi 13 mars 2015   (with FR locale)
                                      //Friday 13th March 2015  (with EN locale)
```
Und für die erste Stunde :
```
moment().format('H:mm:ss'); //23:36:15
```
Dies sind nur kleine Beispiele der Möglichkeiten der Bibliothek.

Für andere Formatierung Muster, siehe diese Tabelle der Dokumentation

InformationsquelleAutor Michael P. Bazos

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.