Huidige tijdsopmaak met JavaScript

Ik wil de huidige tijd krijgen in een specifiek formaat met JavaScript.

Met de onderstaande functie en belt het mij
FRI 01 FEBRUIK 2013 13:56:40 GMT + 1300 (Nieuw-Zeeland Daglichttijd)
Maar ik wil het opmaken zoals
Vrijdag 2:00 PM
1 feb 2013

var d = new Date();
var x = document.getElementById("time");
x.innerHTML = d;

Natuurlijk heeft Code hierboven geen opmaaklogica, maar ik ben nog niet tegengekomen met alle “werkende” -formulieren.


Antwoord 1, Autoriteit 100%

Een JavaScript-datum heeft verschillende methoden waarmee u zijn onderdelen kunt extraheren:

getFullYear()– Retourneert het 4-cijferige jaar
getMonth()– Retourneert een op nul gebaseerd geheel getal (0-11) die de maand van het jaar vertegenwoordigt.
getDate()– Retourneert de dag van de maand (1-31).
getDay()– Retourneert de dag van de week (0-6). 0 is zondag, 6 is zaterdag.
getHours()– Retourneert het uur van de dag (0-23). ​​
getMinutes()– Retourneert de minuut (0-59).
getSeconds()– Retourneert de tweede (0-59).
getMilliseconds()– Retourneert de milliseconden (0-999).
getTimezoneOffset()– Retourneert het aantal minuten tussen de lokale tijd en UTC van de machine.

Er zijn geen ingebouwde methoden waarmee u gelokaliseerde snaren wilt krijgen zoals “vrijdag”, “februari” of “PM”. Je moet dat zelf coderen. Om de gewenste reeks te krijgen, moet u op zijn minst string-representaties van dagen en maanden opslaan:

var months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
var days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];

Stel het vervolgens samen met behulp van de bovenstaande methoden:

var months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
var days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
var d = new Date();
var day = days[d.getDay()];
var hr = d.getHours();
var min = d.getMinutes();
if (min < 10) {
    min = "0" + min;
}
var ampm = "am";
if( hr > 12 ) {
    hr -= 12;
    ampm = "pm";
}
var date = d.getDate();
var month = months[d.getMonth()];
var year = d.getFullYear();
var x = document.getElementById("time");
x.innerHTML = day + " " + hr + ":" + min + ampm + " " + date + " " + month + " " + year;
<span id="time"></span>

Antwoord 2, autoriteit 96%

Misschien wil je het proberen

var d = new Date();
d.toLocaleString();       // -> "2/1/2013 7:37:08 AM"
d.toLocaleDateString();   // -> "2/1/2013"
d.toLocaleTimeString();  // -> "7:38:05 AM"

Documentatie


Antwoord 3, autoriteit 26%

2017 update : gebruik tolocaledatestring en tolocaletimestring om data en tijden te formatteren. De eerste parameter die aan deze methoden is aangenomen, is een landelijke waarde, zoals en-ons . De tweede parameter, indien aanwezig, geeft opmaakopties op, zoals het lange formulier voor de doordeweekse dag.

let date = new Date();  
let options = {  
    weekday: "long", year: "numeric", month: "short",  
    day: "numeric", hour: "2-digit", minute: "2-digit"  
};  
console.log(date.toLocaleTimeString("en-us", options)); 

Antwoord 4, Autoriteit 9%

U kunt mijn haven van strftime :

/* Port of strftime(). Compatibility notes:
 *
 * %c - formatted string is slightly different
 * %D - not implemented (use "%m/%d/%y" or "%d/%m/%y")
 * %e - space is not added
 * %E - not implemented
 * %h - not implemented (use "%b")
 * %k - space is not added
 * %n - not implemented (use "\n")
 * %O - not implemented
 * %r - not implemented (use "%I:%M:%S %p")
 * %R - not implemented (use "%H:%M")
 * %t - not implemented (use "\t")
 * %T - not implemented (use "%H:%M:%S")
 * %U - not implemented
 * %W - not implemented
 * %+ - not implemented
 * %% - not implemented (use "%")
 *
 * strftime() reference:
 * http://man7.org/linux/man-pages/man3/strftime.3.html
 *
 * Day of year (%j) code based on Joe Orost's answer:
 * http://stackoverflow.com/questions/8619879/javascript-calculate-the-day-of-the-year-1-366
 *
 * Week number (%V) code based on Taco van den Broek's prototype:
 * http://techblog.procurios.nl/k/news/view/33796/14863/calculate-iso-8601-week-and-year-in-javascript.html
 */
function strftime(sFormat, date) {
  if (!(date instanceof Date)) date = new Date();
  var nDay = date.getDay(),
    nDate = date.getDate(),
    nMonth = date.getMonth(),
    nYear = date.getFullYear(),
    nHour = date.getHours(),
    aDays = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
    aMonths = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
    aDayCount = [0, 31, 59, 90, 120, 151, 181, 212, 243, 273, 304, 334],
    isLeapYear = function() {
      if ((nYear&3)!==0) return false;
      return nYear%100!==0 || nYear%400===0;
    },
    getThursday = function() {
      var target = new Date(date);
      target.setDate(nDate - ((nDay+6)%7) + 3);
      return target;
    },
    zeroPad = function(nNum, nPad) {
      return ('' + (Math.pow(10, nPad) + nNum)).slice(1);
    };
  return sFormat.replace(/%[a-z]/gi, function(sMatch) {
    return {
      '%a': aDays[nDay].slice(0,3),
      '%A': aDays[nDay],
      '%b': aMonths[nMonth].slice(0,3),
      '%B': aMonths[nMonth],
      '%c': date.toUTCString(),
      '%C': Math.floor(nYear/100),
      '%d': zeroPad(nDate, 2),
      '%e': nDate,
      '%F': date.toISOString().slice(0,10),
      '%G': getThursday().getFullYear(),
      '%g': ('' + getThursday().getFullYear()).slice(2),
      '%H': zeroPad(nHour, 2),
      '%I': zeroPad((nHour+11)%12 + 1, 2),
      '%j': zeroPad(aDayCount[nMonth] + nDate + ((nMonth>1 && isLeapYear()) ? 1 : 0), 3),
      '%k': '' + nHour,
      '%l': (nHour+11)%12 + 1,
      '%m': zeroPad(nMonth + 1, 2),
      '%M': zeroPad(date.getMinutes(), 2),
      '%p': (nHour<12) ? 'AM' : 'PM',
      '%P': (nHour<12) ? 'am' : 'pm',
      '%s': Math.round(date.getTime()/1000),
      '%S': zeroPad(date.getSeconds(), 2),
      '%u': nDay || 7,
      '%V': (function() {
              var target = getThursday(),
                n1stThu = target.valueOf();
              target.setMonth(0, 1);
              var nJan1 = target.getDay();
              if (nJan1!==4) target.setMonth(0, 1 + ((4-nJan1)+7)%7);
              return zeroPad(1 + Math.ceil((n1stThu-target)/604800000), 2);
            })(),
      '%w': '' + nDay,
      '%x': date.toLocaleDateString(),
      '%X': date.toLocaleTimeString(),
      '%y': ('' + nYear).slice(2),
      '%Y': nYear,
      '%z': date.toTimeString().replace(/.+GMT([+-]\d+).+/, '$1'),
      '%Z': date.toTimeString().replace(/.+\((.+?)\)$/, '$1')
    }[sMatch] || sMatch;
  });
}

Voorbeeld van gebruik:

// Returns "Thursday 4:45pm 15 Sep 2016"
strftime('%A %l:%M%P %e %b %Y');
// You can optionally pass it a Date object
// Returns "Friday 2:00pm 1 Feb 2013"
strftime('%A %l:%M%P %e %b %Y', new Date('Feb 1, 2013 2:00 PM'));

De nieuwste code is hier beschikbaar: https://github.com/thdoan/strftime


Antwoord 5, autoriteit 3%

Kijk naar de binnenkant van de klasse Date en je zult zien dat je alle bits kunt extraheren (datum, maand, jaar, uur, enz.).

http://www.w3schools.com/jsref/jsref_obj_date.asp

Voor iets als Fri 23:00 1 Feb 2013is de code als volgt:

date = new Date();
weekdayNames = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
var dateString = weekdayNames[date.getDay()] + " " 
    + date.getHours() + ":" + ("00" + date.getMinutes()).slice(-2) + " " 
    + date.getDate() + " " + monthNames[date.getMonth()] + " " + date.getFullYear();
console.log(dateString);

Antwoord 6, Autoriteit 3%

Er zijn veel geweldige bibliotheken die er zijn, voor degenen die geïnteresseerd zijn

Er zou deze dagen echt geen behoefte moeten zijn om uw eigen formatteringsspecificaties te verzinnen.


Antwoord 7

d = Date.now();
d = new Date(d);
d = (d.getMonth()+1)+'/'+d.getDate()+'/'+d.getFullYear()+' '+(d.getHours() > 12 ? d.getHours() - 12 : d.getHours())+':'+d.getMinutes()+' '+(d.getHours() >= 12 ? "PM" : "AM");
console.log(d);

Antwoord 8

2.39KB GEMINISTIG. Één bestand. https://github.com/rhroyston/clock-js

De huidige tijd is

var str = clock.month;
var m = str.charAt(0).toUpperCase() + str.slice(1,3); //gets you abbreviated month
clock.weekday + ' ' + clock.time + ' ' + clock.day + ' ' + m + ' ' + clock.year; //"tuesday 5:50 PM 3 May 2016"

Antwoord 9

Om met de basis Date-klasse te werken, kun je kijken op MDN voor zijn methoden (in plaats van W3Schools vanwege deze reden). Daar vindt u een goede beschrijving van elke methode die nuttig is om toegang te krijgen tot elke afzonderlijke datum/tijd-component en informatie over het feit of een methode verouderd is of niet.

Anders kun je kijken naar Moment.jsdat een goede bibliotheek is om te gebruiken voor datum- en tijdverwerking. U kunt het gebruiken om datum en tijd te manipuleren (zoals parseren, formatteren, i18n, enz.).


Antwoord 10

function formatTime(date){
  d = new Date(date);
  var h=d.getHours(),m=d.getMinutes(),l="AM";
  if(h > 12){
    h = h - 12;
  }
  if(h < 10){
    h = '0'+h;
  }
  if(m < 10){
    m = '0'+m;
  }
  if(d.getHours() >= 12){
    l="PM"
  }else{
    l="AM"
  }
  return h+':'+m+' '+l;
}

Gebruik & resultaat:

var formattedTime=formatTime(new Date('2020 15:00'));
// Output: "03:00 PM"

Antwoord 11

Gebruik voor deze echte mysql-stijl deze functie hieronder: 2019/02/28 15:33:12

  • Als u op de
  • Knop ‘Codefragment uitvoeren’ hieronder
  • Het toont je een eenvoudig realtime digitaal klokvoorbeeld
    De demo verschijnt onder het codefragment.
function getDateTime() {
        var now     = new Date(); 
        var year    = now.getFullYear();
        var month   = now.getMonth()+1; 
        var day     = now.getDate();
        var hour    = now.getHours();
        var minute  = now.getMinutes();
        var second  = now.getSeconds(); 
        if(month.toString().length == 1) {
             month = '0'+month;
        }
        if(day.toString().length == 1) {
             day = '0'+day;
        }   
        if(hour.toString().length == 1) {
             hour = '0'+hour;
        }
        if(minute.toString().length == 1) {
             minute = '0'+minute;
        }
        if(second.toString().length == 1) {
             second = '0'+second;
        }   
        var dateTime = year+'/'+month+'/'+day+' '+hour+':'+minute+':'+second;   
         return dateTime;
    }
    // example usage: realtime clock
    setInterval(function(){
        currentTime = getDateTime();
        document.getElementById("digital-clock").innerHTML = currentTime;
    }, 1000);
<div id="digital-clock"></div>

Antwoord 12

Momentgebruiken.

Ik kan het gebruik van Momentniet genoeg aanbevelen. Als u bibliotheken van derden kunt gebruiken, raad ik u ten zeerste aan dit te doen. Naast formatteren, gaat het buitengewoon goed om met tijdzones, parsing, tijdsduur en tijdreizen en zal het zijn vruchten afwerpen in eenvoud en tijd (ten koste van grootte, abstractie en prestaties).

Gebruik

Je wilde iets dat er zo uitzag:

Vrijdag 1 februari 2013 om 14:00 uur

Nou, met Moment hoef je alleen maar dit te doen:

import Moment from "moment";
Moment().format( "dddd h:mma D MMM YYYY" ); //=> "Wednesday 9:20am 9 Dec 2020"

En als je die exacte datum en tijd wilt matchen, hoef je alleen maar dit te doen:

import Moment from "moment";
Moment( "2013-2-1 14:00:00" ).format( "dddd h:mma D MMM YYYY" ) ); //=> "Friday 2:00pm 1 Feb 2013"

Er zijn talloze andere opmaakopties die hierte vinden zijn.

Installeren

Ga naar hun startpaginavoor meer gedetailleerde instructies, maar als je npm of garen gebruikt, is het zo eenvoudig als:

npm install moment --save

of

yarn add moment

Antwoord 13

function startTime() {
    var today = new Date(),
        h = checkTime(((today.getHours() + 11) % 12 + 1)),
        m = checkTime(today.getMinutes()),
        s = checkTime(today.getSeconds());
    document.getElementById('demo').innerHTML = h + ":" + m + ":" + s;
    t = setTimeout(function () {
        startTime()
    }, 500);
}
startTime();

})();

05:12:00


Antwoord 14

let date = new Date();
let time = date.format("hh:ss")

Other episodes