Comment puis-je formater un objet de date JavaScript à imprimer en tant que 10-Aug-2010
?
Attention: Il y a de meilleures réponses ci-dessous. Cette réponse a été écrite en 2010 et des solutions plus récentes et améliorées sont arrivées depuis. Le PO devrait accepter une autre réponse.
function formatDate(date) {
var monthNames = [
"January", "February", "March",
"April", "May", "June", "July",
"August", "September", "October",
"November", "December"
];
var day = date.getDate();
var monthIndex = date.getMonth();
var year = date.getFullYear();
return day + ' ' + monthNames[monthIndex] + ' ' + year;
}
console.log(formatDate(new Date())); // show current date-time in console
Vous pouvez éditer le tableau monthNames
pour utiliser Jan, Feb, Mar, etc.
toLocaleDateString()
La méthode toLocaleDateString()
renvoie une chaîne avec une représentation sensible à la langue de la partie date de la date. Les arguments locales et options permettent aux applications de spécifier la langue dont les conventions de formatage doivent être utilisées et permettent de personnaliser le comportement de la fonction.
Toutes ces clés sont facultatives. Vous pouvez modifier le nombre de valeurs d'options en fonction de vos besoins, ce qui reflétera également la présence de chaque terme date-heure.
Remarque: Si vous souhaitez uniquement configurer les options de contenu, tout en utilisant les paramètres régionaux en vigueur, transmettre null
pour le premier paramètre provoquera une erreur. Utilisez undefined
à la place.
Vous pouvez utiliser plus d'options de langue.
var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
var today = new Date();
console.log(today.toLocaleDateString("en-US")); // 9/17/2016
console.log(today.toLocaleDateString("en-US", options)); // Saturday, September 17, 2016
console.log(today.toLocaleDateString("hi-IN", options)); // शनिवार, 17 सितंबर 2016
Vous pouvez également utiliser la méthode toLocaleString()
dans le même but. La seule différence est que cette fonction indique l'heure à laquelle vous ne passez aucune option.
// Example
9/17/2016, 1:21:34 PM
Utilisez la bibliothèque date.format :
var dateFormat = require('dateformat');
var now = new Date();
dateFormat(now, "dddd, mmmm dS, yyyy, h:MM:ss TT");
résultats:
Saturday, June 9th, 2007, 5:46:21 PM
Si vous devez formater rapidement votre date à l'aide de JavaScript, utilisez getDate
, getMonth + 1
, getFullYear
, getHours
et getMinutes
:
var d = new Date();
var datestring = d.getDate() + "-" + (d.getMonth()+1) + "-" + d.getFullYear() + " " +
d.getHours() + ":" + d.getMinutes();
// 16-5-2015 9:50
Ou, si vous en avez besoin pour être rempli de zéros:
var datestring = ("0" + d.getDate()).slice(-2) + "-" + ("0"+(d.getMonth()+1)).slice(-2) + "-" +
d.getFullYear() + " " + ("0" + d.getHours()).slice(-2) + ":" + ("0" + d.getMinutes()).slice(-2);
// 16-05-2015 09:50
Ce que je voulais, c’était de convertir la date du jour en une chaîne de date MySQL friendly comme 2012-06-23, et d’utiliser cette chaîne comme paramètre dans l’une de mes requêtes. La solution simple que j'ai trouvée est la suivante:
var today = new Date().toISOString().slice(0, 10);
N'oubliez pas que la solution ci-dessus not ne tient pas compte de votre décalage de fuseau horaire.
Vous pourriez envisager d'utiliser cette fonction à la place:
function toJSONLocal (date) {
var local = new Date(date);
local.setMinutes(date.getMinutes() - date.getTimezoneOffset());
return local.toJSON().slice(0, 10);
}
Cela vous donnera la date correcte au cas où vous exécuteriez ce code vers le début/la fin de la journée.
Si vous utilisez déjà jQuery UI dans votre projet, vous pouvez le faire comme suit:
var formatted = $.datepicker.formatDate("M d, yy", new Date("2014-07-08T09:02:21.377"));
// formatted will be 'Jul 8, 2014'
Certaines options de format de date datepicker pour jouer sont disponibles ici .
Pour les formats fixes, une fonction simple fait le travail. L'exemple suivant génère le format international AAAA-MM-JJ:
function dateToYMD(date) {
var d = date.getDate();
var m = date.getMonth() + 1; //Month from 0 to 11
var y = date.getFullYear();
return '' + y + '-' + (m<=9 ? '0' + m : m) + '-' + (d <= 9 ? '0' + d : d);
}
console.log(dateToYMD(new Date(2017,10,5))); // Nov 5
Le format OP peut être généré de la manière suivante:
function dateToYMD(date) {
var strArray=['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
var d = date.getDate();
var m = strArray[date.getMonth()];
var y = date.getFullYear();
return '' + (d <= 9 ? '0' + d : d) + '-' + m + '-' + y;
}
console.log(dateToYMD(new Date(2017,10,5))); // Nov 5
Remarque: Cependant, il n'est généralement pas conseillé d'étendre les bibliothèques standard JavaScript (par exemple, en ajoutant cette fonction au prototype de Date).
Une fonction plus avancée pourrait générer une sortie configurable basée sur un paramètre de format.
Si écrire une fonction de formatage est trop long, il y a beaucoup de bibliothèques autour desquelles le fait. Certaines autres réponses les énumèrent déjà. Mais les dépendances croissantes ont aussi leur contrepartie.
Depuis les versions les plus récentes d'ECMAScript, la classe Date
possède des fonctions de formatage spécifiques:
toDateString: Dépend de l'implémentation, affiche uniquement la date.
http://www.ecma-international.org/ecma-262/7.0/index.html#sec-date.prototype.todatestring
new Date().toDateString(); // e.g. "Fri Nov 11 2016"
toISOString: Affiche la date et l'heure ISO 8601.
http://www.ecma-international.org/ecma-262/7.0/index.html#sec-date.prototype.toisostring
new Date().toISOString(); // e.g. "2016-11-21T08:00:00.000Z"
toJSON: identificateur de chaîne pour JSON.
http://www.ecma-international.org/ecma-262/7.0/index.html#sec-date.prototype.tojson
new Date().toJSON(); // e.g. "2016-11-21T08:00:00.000Z"
toLocaleDateString: Dépend de l'implémentation, une date au format de paramètres régionaux.
http://www.ecma-international.org/ecma-262/7.0/index.html#sec-date.prototype.tolocaledatestring
new Date().toLocaleDateString(); // e.g. "21/11/2016"
toLocaleString: Dépend de l'implémentation, une date et une heure au format de paramètres régionaux.
http://www.ecma-international.org/ecma-262/7.0/index.html#sec-date.prototype.tolocalestring
new Date().toLocaleString(); // e.g. "21/11/2016, 08:00:00 AM"
toLocaleTimeString: Dépend de l'implémentation, une heure au format de paramètres régionaux.
http://www.ecma-international.org/ecma-262/7.0/index.html#sec-date.prototype.tolocaletimestring
new Date().toLocaleTimeString(); // e.g. "08:00:00 AM"
toString: toString générique pour Date.
http://www.ecma-international.org/ecma-262/7.0/index.html#sec-date.prototype.tostring
new Date().toString(); // e.g. "Fri Nov 21 2016 08:00:00 GMT+0100 (W. Europe Standard Time)"
Remarque: il est possible de générer une sortie personnalisée à partir de ce formatage>
new Date().toISOString().slice(0,10); //return YYYY-MM-DD
Exemples d'extraits:
console.log("1) "+ new Date().toDateString());
console.log("2) "+ new Date().toISOString());
console.log("3) "+ new Date().toJSON());
console.log("4) "+ new Date().toLocaleDateString());
console.log("5) "+ new Date().toLocaleString());
console.log("6) "+ new Date().toLocaleTimeString());
console.log("7) "+ new Date().toString());
console.log("8) "+ new Date().toISOString().slice(0,10));
Je pense que vous pouvez simplement utiliser la méthode non standard Date toLocaleFormat(formatString)
formatString: Chaîne de format dans le même format attendu par la fonction strftime()
en C.
var today = new Date();
today.toLocaleFormat('%d-%b-%Y'); // 30-Dec-2011
Références:
JavaScript simple est le meilleur choix pour les petits utilisateurs.
D'autre part, si vous avez besoin de plus de choses à propos de la date, MomentJS est une excellente solution.
Par exemple:
moment().format('YYYY-MM-DD HH:m:s'); // now() -> 2015-03-24 14:32:20
moment("20111031", "YYYYMMDD").fromNow(); // 3 years ago
moment("20120620", "YYYYMMDD").fromNow(); // 3 years ago
moment().startOf('day').fromNow(); // 11 hours ago
moment().endOf('day').fromNow(); // in 13 hours
Dans les navigateurs modernes (*), vous pouvez simplement faire ceci:
var today = new Date().toLocaleDateString('en-GB', {
day : 'numeric',
month : 'short',
year : 'numeric'
}).split(' ').join('-');
Sortie si exécutée aujourd'hui (24 janvier 2016):
'24-Jan-2016'
(*)Selon MDN , "navigateurs modernes" désigne Chrome 24+, Firefox 29+, Internet Explorer 11, Edge 12+, Opera 15+ et Safari nocturne construire .
Vous devriez jeter un oeil à date.js . Il ajoute de nombreuses aides pratiques pour travailler avec les dates, par exemple, dans votre cas:
var date = Date.parse('2010-08-10');
console.log(date.toString('dd-MMM-yyyy'));
Pour commencer: http://www.datejs.com/2007/11/27/getting-started-with-datejs/
Je peux obtenir votre format demandé en une ligne sans utiliser de bibliothèques, ni de méthodes Date, il suffit de regex:
var d = (new Date()).toString().replace(/\S+\s(\S+)\s(\d+)\s(\d+)\s.*/,'$2-$1-$3');
// date will be formatted as "14-Oct-2015" (pass any date object in place of 'new Date()')
Mise à jour: Comme l'a souligné @RobG, la sortie de Date.prototype.toString () dépend de la mise en œuvre. Utilisez donc avec prudence et modifiez si nécessaire pour vos implémentations si vous utilisez cette solution. Lors de mes tests, cela fonctionne de manière fiable en Amérique du Nord où les principaux navigateurs (Chrome, Safari, Firefox et IE) renvoient tous le même format de chaîne.
@ Sébastien - support alternatif pour tous les navigateurs
new Date(parseInt(496407600)*1000).toLocaleDateString('de-DE', {
year: 'numeric',
month: '2-digit',
day: '2-digit'
}).replace(/\./g, '/');
Documentation: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString
Utilisation d'un modèle de chaîne ECMAScript Edition 6 (ES6/ES2015):
let d = new Date();
let formatted = `${d.getFullYear()}-${d.getMonth() + 1}-${d.getDate()}`;
Si vous devez changer les délimiteurs:
const delimiter = '/';
let formatted = [d.getFullYear(), d.getMonth() + 1, d.getDate()].join(delimiter);
Voici un code que je viens d'écrire pour gérer le formatage de la date pour un projet sur lequel je travaille. Il imite la fonctionnalité de formatage de date PHP en fonction de mes besoins. N'hésitez pas à l'utiliser, il s'agit simplement d'étendre l'objet Date () déjà existant. Ce n'est peut-être pas la solution la plus élégante, mais cela fonctionne pour mes besoins.
var d = new Date();
d_string = d.format("m/d/Y h:i:s");
/**************************************
* Date class extension
*
*/
// Provide month names
Date.prototype.getMonthName = function(){
var month_names = [
'January',
'February',
'March',
'April',
'May',
'June',
'July',
'August',
'September',
'October',
'November',
'December'
];
return month_names[this.getMonth()];
}
// Provide month abbreviation
Date.prototype.getMonthAbbr = function(){
var month_abbrs = [
'Jan',
'Feb',
'Mar',
'Apr',
'May',
'Jun',
'Jul',
'Aug',
'Sep',
'Oct',
'Nov',
'Dec'
];
return month_abbrs[this.getMonth()];
}
// Provide full day of week name
Date.prototype.getDayFull = function(){
var days_full = [
'Sunday',
'Monday',
'Tuesday',
'Wednesday',
'Thursday',
'Friday',
'Saturday'
];
return days_full[this.getDay()];
};
// Provide full day of week name
Date.prototype.getDayAbbr = function(){
var days_abbr = [
'Sun',
'Mon',
'Tue',
'Wed',
'Thur',
'Fri',
'Sat'
];
return days_abbr[this.getDay()];
};
// Provide the day of year 1-365
Date.prototype.getDayOfYear = function() {
var onejan = new Date(this.getFullYear(),0,1);
return Math.ceil((this - onejan) / 86400000);
};
// Provide the day suffix (st,nd,rd,th)
Date.prototype.getDaySuffix = function() {
var d = this.getDate();
var sfx = ["th","st","nd","rd"];
var val = d%100;
return (sfx[(val-20)%10] || sfx[val] || sfx[0]);
};
// Provide Week of Year
Date.prototype.getWeekOfYear = function() {
var onejan = new Date(this.getFullYear(),0,1);
return Math.ceil((((this - onejan) / 86400000) + onejan.getDay()+1)/7);
}
// Provide if it is a leap year or not
Date.prototype.isLeapYear = function(){
var yr = this.getFullYear();
if ((parseInt(yr)%4) == 0){
if (parseInt(yr)%100 == 0){
if (parseInt(yr)%400 != 0){
return false;
}
if (parseInt(yr)%400 == 0){
return true;
}
}
if (parseInt(yr)%100 != 0){
return true;
}
}
if ((parseInt(yr)%4) != 0){
return false;
}
};
// Provide Number of Days in a given month
Date.prototype.getMonthDayCount = function() {
var month_day_counts = [
31,
this.isLeapYear() ? 29 : 28,
31,
30,
31,
30,
31,
31,
30,
31,
30,
31
];
return month_day_counts[this.getMonth()];
}
// format provided date into this.format format
Date.prototype.format = function(dateFormat){
// break apart format string into array of characters
dateFormat = dateFormat.split("");
var date = this.getDate(),
month = this.getMonth(),
hours = this.getHours(),
minutes = this.getMinutes(),
seconds = this.getSeconds();
// get all date properties ( based on PHP date object functionality )
var date_props = {
d: date < 10 ? '0'+date : date,
D: this.getDayAbbr(),
j: this.getDate(),
l: this.getDayFull(),
S: this.getDaySuffix(),
w: this.getDay(),
z: this.getDayOfYear(),
W: this.getWeekOfYear(),
F: this.getMonthName(),
m: month < 10 ? '0'+(month+1) : month+1,
M: this.getMonthAbbr(),
n: month+1,
t: this.getMonthDayCount(),
L: this.isLeapYear() ? '1' : '0',
Y: this.getFullYear(),
y: this.getFullYear()+''.substring(2,4),
a: hours > 12 ? 'pm' : 'am',
A: hours > 12 ? 'PM' : 'AM',
g: hours % 12 > 0 ? hours % 12 : 12,
G: hours > 0 ? hours : "12",
h: hours % 12 > 0 ? hours % 12 : 12,
H: hours,
i: minutes < 10 ? '0' + minutes : minutes,
s: seconds < 10 ? '0' + seconds : seconds
};
// loop through format array of characters and add matching data else add the format character (:,/, etc.)
var date_string = "";
for(var i=0;i<dateFormat.length;i++){
var f = dateFormat[i];
if(f.match(/[a-zA-Z]/g)){
date_string += date_props[f] ? date_props[f] : '';
} else {
date_string += f;
}
}
return date_string;
};
/*
*
* END - Date class extension
*
************************************/
Si vous utilisez l'interface utilisateur jQuery dans votre code, il existe une fonction intégrée appelée formatDate()
. Je l'utilise de cette façon pour formater la date d'aujourd'hui:
var testdate = Date();
testdate = $.datepicker.formatDate( "d-M-yy",new Date(testdate));
alert(testdate);
Vous pouvez voir de nombreux autres exemples de date de formatage dans la documentation de l'interface utilisateur de jQuery .
new Date().toLocaleDateString()
// "3/21/2018"
Plus de documentation sur developer.mozilla.org
Solution JavaScript sans utiliser de bibliothèques externes:
var now = new Date()
months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec']
var formattedDate = now.getDate()+"-"+months[now.getMonth()]+"-"+now.getFullYear()
alert(formattedDate)
Voici comment j'ai implémenté mes plugins npm
var monthNames = [
"January", "February", "March",
"April", "May", "June", "July",
"August", "September", "October",
"November", "December"
];
var Days = [
"Sunday", "Monday", "Tuesday", "Wednesday",
"Thursday", "Friday", "Saturday"
];
var formatDate = function(dt,format){
format = format.replace('ss', pad(dt.getSeconds(),2));
format = format.replace('s', dt.getSeconds());
format = format.replace('dd', pad(dt.getDate(),2));
format = format.replace('d', dt.getDate());
format = format.replace('mm', pad(dt.getMinutes(),2));
format = format.replace('m', dt.getMinutes());
format = format.replace('MMMM', monthNames[dt.getMonth()]);
format = format.replace('MMM', monthNames[dt.getMonth()].substring(0,3));
format = format.replace('MM', pad(dt.getMonth()+1,2));
format = format.replace(/M(?![ao])/, dt.getMonth()+1);
format = format.replace('DD', Days[dt.getDay()]);
format = format.replace(/D(?!e)/, Days[dt.getDay()].substring(0,3));
format = format.replace('yyyy', dt.getFullYear());
format = format.replace('YYYY', dt.getFullYear());
format = format.replace('yy', (dt.getFullYear()+"").substring(2));
format = format.replace('YY', (dt.getFullYear()+"").substring(2));
format = format.replace('HH', pad(dt.getHours(),2));
format = format.replace('H', dt.getHours());
return format;
}
pad = function(n, width, z) {
z = z || '0';
n = n + '';
return n.length >= width ? n : new Array(width - n.length + 1).join(z) + n;
}
Un moyen utile et flexible de formater les DateTimes en JavaScript est Intl.DateTimeFormat
:
var date = new Date();
var options = { year: 'numeric', month: 'short', day: '2-digit'};
var _resultDate = new Intl.DateTimeFormat('en-GB', options).format(date);
// The _resultDate is: "12 Oct 2017"
// Replace all spaces with - and then log it.
console.log(_resultDate.replace(/ /g,'-'));
Le résultat est: "12-Oct-2017"
Les formats de date et d’heure peuvent être personnalisés à l’aide de l’argument options.
L'objet Intl.DateTimeFormat
est un constructeur pour les objets qui activent le formatage de date et heure en fonction du langage.
Syntaxe
new Intl.DateTimeFormat([locales[, options]])
Intl.DateTimeFormat.call(this[, locales[, options]])
Paramètres
locales
Optionnel. Une chaîne avec une balise de langage BCP 47 ou un tableau de ces chaînes. Pour la forme générale et l'interprétation de l'argument locale, voir la page Intl. Les clés d'extension Unicode suivantes sont autorisées:
nu
Numbering system. Possible values include: "arab", "arabext", "bali", "beng", "deva", "fullwide", "gujr", "guru", "hanidec", "khmr", "knda", "laoo", "latn", "limb", "mlym", "mong", "mymr", "orya", "tamldec", "telu", "thai", "tibt".
ca
Calendar. Possible values include: "buddhist", "chinese", "coptic", "ethioaa", "ethiopic", "gregory", "hebrew", "indian", "islamic", "islamicc", "iso8601", "japanese", "persian", "roc".
Options
Optionnel. Un objet avec tout ou partie des propriétés suivantes:
localeMatcher
L'algorithme de correspondance de paramètres régionaux à utiliser. Les valeurs possibles sont "lookup"
et "best fit"
; La valeur par défaut est "best fit"
. Pour plus d'informations sur cette option, voir la page Intl.
fuseau horaire
Le fuseau horaire à utiliser. La seule valeur que les implémentations doivent reconnaître est "UTC"
; la valeur par défaut est le fuseau horaire par défaut du runtime. Les implémentations peuvent également reconnaître les noms de fuseau horaire de la base de données de fuseaux horaires IANA, tels que "Asia/Shanghai"
, "Asia/Kolkata"
, "America/New_York"
.
heure12
Utiliser ou non le temps de 12 heures (par opposition au temps de 24 heures). Les valeurs possibles sont true
et false
; la valeur par défaut dépend des paramètres régionaux.
formatMatcher
L'algorithme de correspondance de format à utiliser. Les valeurs possibles sont "basic"
et "best fit"
; La valeur par défaut est "best fit"
. Voir les paragraphes suivants pour plus d’informations sur l’utilisation de cette propriété.
Les propriétés suivantes décrivent les composants date-heure à utiliser dans une sortie mise en forme et leurs représentations souhaitées. Les implémentations doivent prendre en charge au moins les sous-ensembles suivants:
weekday, year, month, day, hour, minute, second
weekday, year, month, day
year, month, day
year, month
month, day
hour, minute, second
hour, minute
Les implémentations peuvent prendre en charge d'autres sous-ensembles, et les demandes seront négociées par rapport à toutes les combinaisons de représentation de sous-ensemble disponibles afin de trouver la meilleure correspondance. Deux algorithmes sont disponibles pour cette négociation et sélectionnés par la propriété formatMatcher: un algorithme "basic"
entièrement spécifié et un algorithme "meilleur ajustement" dépendant de la mise en oeuvre.
jour de la semaine
La représentation du jour de la semaine. Les valeurs possibles sont "narrow"
, "short"
, "long"
.
ère
La représentation de l'époque. Les valeurs possibles sont "narrow"
, "short"
, "long"
.
année
La représentation de l'année. Les valeurs possibles sont "numeric"
, "2-digit"
.
mois
La représentation du mois. Les valeurs possibles sont "numeric"
, "2-digit"
, "narrow"
, "short"
, "long"
.
journée
La représentation du jour. Les valeurs possibles sont "numeric"
, "2-digit"
.
heure
La représentation de l'heure. Les valeurs possibles sont "numeric"
, "2-digit"
.
minute
La représentation de la minute. Les valeurs possibles sont "numeric"
, "2-digit"
.
seconde
La représentation de la seconde. Les valeurs possibles sont "numeric"
, "2-digit"
.
timeZoneName
La représentation du nom du fuseau horaire. Les valeurs possibles sont "short"
, "long"
. La valeur par défaut de chaque propriété de composant date-heure n'est pas définie, mais si toutes les propriétés du composant ne sont pas définies, l'année, le mois et le jour sont supposés être "numeric"
.
OK, nous avons un système appelé Intl très utile pour formater une date en JavaScript ces jours-ci:
Votre date comme ci-dessous:
var date = '10/8/2010';
Et vous passez à Date en utilisant new Date () comme ci-dessous:
date = new Date(date);
Et maintenant, vous pouvez le formater comme bon vous semble en utilisant une liste de locales comme ci-dessous:
date = new Intl.DateTimeFormat('en-AU').format(date); // Australian date format: "8/10/2010"
date = new Intl.DateTimeFormat('en-US').format(date); // USA date format: "10/8/2010"
date = new Intl.DateTimeFormat('ar-EG').format(date); // Arabic date format: "٨/١٠/٢٠١٠"
Si vous voulez exactement le format que vous avez mentionné ci-dessus, vous pouvez faire:
date = new Date(Date.UTC(2010, 7, 10, 0, 0, 0));
var options = {year: "numeric", month: "short", day: "numeric"};
date = new Intl.DateTimeFormat("en-AU", options).format(date).replace(/\s/g, '-');
Et le résultat va être:
"10-Aug-2010"
Pour plus de détails sur ECMAScript Internationalization API (Intl), visitez ici .
var today = new Date();
var formattedToday = today.toLocaleDateString() + ' ' + today.toLocaleTimeString();
Pour tous ceux qui recherchent une solution ES6 très simple à copier, coller et adopter:
const dateToString = d => `${d.getFullYear()}-${('00' + (d.getMonth() + 1)).slice(-2)}-${('00' + d.getDate()).slice(-2)}`
// how to use:
const myDate = new Date(Date.parse('04 Dec 1995 00:12:00 GMT'))
console.log(dateToString(myDate)) // 1995-12-04
Sugar.js a d'excellentes extensions de l'objet Date, y compris une méthode Date.format .
Exemples tirés de la documentation:
Date.create().format('{Weekday} {Month} {dd}, {yyyy}');
Date.create().format('{12hr}:{mm}{tt}')
Essaye ça:
function init(){
var d = new Date();
var day = d.getDate();
var x = d.toDateString().substr(4, 3);
var year = d.getFullYear();
document.querySelector("#mydate").innerHTML = day + '-' + x + '-' + year;
}
window.onload = init;
<div id="mydate"></div>
Il existe une nouvelle bibliothèque, smarti.to.js , pour la mise en forme localisée des nombres JavaScript, des dates et des dates JSON (Microsoft ou ISO8601).
Exemple:
new Date('2015-1-1').to('dd.MM.yy') // Outputs 01.01.2015
"2015-01-01T10:11:12.123Z".to('dd.MM.yy') // Outputs 01.01.2015
Il existe également des modèles courts personnalisés définis dans le fichier de localisation (smarti.to. {Culture} .js). Exemple (smarti.to.et-EE.js):
new Date('2015-1-1').to('d') // Outputs 1.01.2015
Et une capacité multi-formatage:
smarti.format('{0:n2} + {1:n2} = {2:n2}', 1, 2, 3) // Output: 1,00 + 2,00 = 3,00
Inspiré par la merveilleuse solution d’expression régulière de JD Smith , j’ai soudain eu cette idée déchirante:
var D = Date().toString().split(" ");
document.getElementById("demo").innerHTML = D[2] + "-" + D[1] + "-" + D[3];
Si vous souhaitez utiliser une fonction courte, lisible par un humain, vous pourrez facilement l’ajuster à votre guise.
Le paramètre timeStamp est exprimé en millisecondes à partir de 1970 - il est renvoyé par new Date().getTime()
et de nombreux autres périphériques ...
OK, j'ai changé d'avis. J'ai inclus une fonction supplémentaire pour zéro padding. Maudits!
function zeroPad(aNumber) {
return ("0"+aNumber).slice(-2);
}
function humanTime(timeStamp) {
var M = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
var D = new Date(timeStamp); // 23 Aug 2016 16:45:59 <-- Desired format.
return D.getDate() + " " + M[D.getMonth()] + " " + D.getFullYear() + " " + D.getHours() + ":" + zeroPad(d.getMinutes()) + ":" + zeroPad(D.getSeconds());
}
Ajoutez le jQuery UI plugin à votre page:
function DateFormate(dateFormate, datetime) {
return $.datepicker.formatDate(dateFormate, datetime);
};
J'utilise le suivant. C'est simple et fonctionne bien.
var dtFormat = require('dtformat');
var today = new Date();
dtFormat(today, "dddd, mmmm dS, yyyy, h:MM:ss TT");
Ou ca:
var now = new Date()
months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
var formattedDate = now.getDate() + "-" + months[now.getMonth()] + "-" + now.getFullYear()
alert(formattedDate)
Voici un script qui fait exactement ce que vous voulez
https://github.com/UziTech/js-date-format
var d = new Date("2010-8-10");
document.write(d.format("DD-MMM-YYYY"));
Autre moyen que vous pouvez formater la date
function formatDate(dDate,sMode){
var today = dDate;
var dd = today.getDate();
var mm = today.getMonth()+1; //January is 0!
var yyyy = today.getFullYear();
if(dd<10) {
dd = '0'+dd
}
if(mm<10) {
mm = '0'+mm
}
if (sMode+""==""){
sMode = "dd/mm/yyyy";
}
if (sMode == "yyyy-mm-dd"){
return yyyy + "-" + mm + "-" + dd + "";
}
if (sMode == "dd/mm/yyyy"){
return dd + "/" + mm + "/" + yyyy;
}
}
Si vous êtes utilisez déjà ExtJS dans votre projet, vous pouvez utiliser Ext.Date :
var date = new Date();
Ext.Date.format(date, "d-M-Y");
résultats:
"11-Nov-2015"
Je poste ici pour référence future et prêt-à-copier-coller, c’est la réponse principale modifiée pour avoir des mois de 3 caractères et une année à 2 chiffres:
function formatDate(date) {
var monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
var day = date.getDate(), monthIndex = date.getMonth(), year = date.getFullYear().toString().substr(-2);
return day + ' ' + monthNames[monthIndex] + ' ' + year;
}
document.write(formatDate(new Date()));
Je sais que quelqu'un dira peut-être que c'est une solution idiote, mais cela permet d'éliminer les informations inutiles de la date.
yourDateObject
produit:
Mer 13 déc 2017 20:40:40 GMT + 0200 (EET)
yourDateObject.toString().slice(0, 15);
produit:
Mer 13 déc 2017
Le code suivant vous permettra de formater la date en DD-MM-YYYY
(27-12-2017) ou DD MMM YYYY
(27 déc 2017):
/** Pad number to fit into nearest power of 10 */
function padNumber(number, prependChar, count) {
var out = '' + number; var i;
if (number < Math.pow(10, count))
while (out.length < ('' + Math.pow(10, count)).length) out = prependChar + out;
return out;
}
/* Format the date to 'DD-MM-YYYY' or 'DD MMM YYYY' */
function dateToDMY(date, useNumbersOnly) {
var months = [
'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct',
'Nov', 'Dec'
];
return '' + padNumber(date.getDate(), '0', 1) +
(useNumbersOnly? '-' + padNumber(date.getMonth() + 1, '0', 1) + '-' : ' ' + months[date.getMonth()] + ' ')
+ date.getFullYear();
}
Modifiez l'ordre de date.getFullYear()
et padNumber(date.getDate(), '0', 1)
pour créer une fonction dateToYMD()
.
Voir l'exemple repl.it pour plus de détails.
Approche courte et largement compatible:
function formatDate(date) {
date.toISOString()
.replace(/^(\d+)-(\d+)-(\d+).*$/, // Only extract Y-M-D
function (a,y,m,d) {
return [
d, // Day
['Jan','Feb','Mar','Apr','May','Jun', // Month Names
'Jul','Ago','Sep','Oct','Nov','Dec']
[m-1], // Month
y // Year
].join('-') // Stitch together
})
}
Ou, en une seule ligne:
date.toISOString().replace(/^(\d+)-(\d+)-(\d+)T(\d+):(\d+):(\d+).(\d+)Z$/, function (a,y,m,d) {return [d,['Jan','Feb','Mar','Apr','May','Jun','Jul','Ago','Sep','Oct','Nov','Dic'][m-1],y].join('-')})
2,39 Ko minifiée. Un fichier. https://github.com/rhroyston/clock-js
10 août 2010 serait:
var str = clock.month
str.charAt(0).toUpperCase() + str.slice(1,3); //gets you "Aug"
console.log(clock.day + '-' + str + '-' + clock.year); //gets you 10-Aug-2010
Ce Module peut facilement gérer la plupart des cas. Il fait partie d’un paquet plus grand de npm, par Locutus, qui inclut une variété de fonctions, mais peut être utilisé totalement indépendant du paquet, il suffit de copier coller/adapter un peu une fonction)
En tant que second paramètre, il accepte un horodatage, qui peut provenir de n’importe où, tel que Date.getTime ()
En outre, Locutus gère un module datetime plus volumineux, également à l’intérieur du paquet locutus, ce qui offrira une méthode plus orientée objet pour l’utiliser.
Ici vous pouvez voir d’autres fonctions datetime, sous forme de modules, qui se sont révélées très utiles également.
Vous pouvez trouver de la documentation sur les paramètres et les chaînes de format ici (notez que le site doc est un site php, mais que la mise en oeuvre de locutus suit exactement les mêmes spécifications)
Exemples de date Module
date('H:m:s \\m \\i\\s \\m\\o\\n\\t\\h', 1062402400)//'07:09:40 m is month'
date('F j, Y, g:i a', 1062462400)//'September 2, 2003, 12:26 am'
date('Y W o', 1062462400)//'2003 36 2003'
var $x = date('Y m d', (new Date()).getTime() / 1000) $x = $x + '' var $result = $x.length // 2009 01 09 10
date('W', 1104534000) //'52'
date('B t', 1104534000) //'999 31'
date('W U', 1293750000.82); // 2010-12-31 '52 1293750000'
date('W', 1293836400); // 2011-01-01 '52'
date('W Y-m-d', 1293974054); // 2011-01-02 '52 2011-01-02'
Pour obtenir le "10 août 2010", essayez:
var date = new Date('2010-08-10 00:00:00');
date = date.toLocaleDateString(undefined, {day:'2-digit'}) + '-' + date.toLocaleDateString(undefined, {month:'short'}) + '-' + date.toLocaleDateString(undefined, {year:'numeric'})
Pour la prise en charge du navigateur, voir toLocaleDateString .
Fonction simple pouvant renvoyer la date, la date + heure, ou simplement l'heure:
var myDate = dateFormatter( "2019-01-24 11:33:24", "date-time" );
// >> RETURNS "January 24, 2019 11:33:24"
var myDate2 = dateFormatter( "2019-01-24 11:33:24", "date" );
// >> RETURNS "January 24, 2019"
var myDate3 = dateFormatter( "2019-01-24 11:33:24", "time" );
// >> RETURNS "11:33:24"
function dateFormatter( strDate, format ){
var theDate = new Date(strDate);
if( format=="time" )
return getTimeFromDate(theDate);
else{
var dateOptions = {year:'numeric', month:'long', day:'numeric'};
var formattedDate = theDate.toLocaleDateString("en-US", + dateOptions);
if( format=="date" )
return formattedDate;
return formattedDate + " " + getTimeFromDate(theDate);
}
}
function getTimeFromDate( theDate ){
var sec = theDate.getSeconds();
if( sec<10 )
sec = "0"+sec;
var min = theDate.getMinutes();
if( min<10 )
min = "0"+min;
return theDate.getHours() + ':'+ min + ':' + sec;
}
Cette bibliothèque peut formater l'objet de date et analyser la chaîne formatée dans l'objet Date. Il utilise le format Java (classe SimpleDateFormat). Le nom des mois et des jours peut être localisé.
http://www.javascriptsource.com/repository/javascripts/2009/03/880961/JS_Simple_Date_Format.Zip
Exemple:
var sdf = new JsSimpleDateFormat("dd-MMM-yyyy");
var formattedString = sdf.format(new Date());
var dateObject = sdf.parse("10-Aug-2010");
Voici un code de formatage date/heure prêt à coller qui ne repose PAS sur des modules/bibliothèques externes, ni n'utilise jQuery ou ES7 ou quoi que ce soit. Contrairement au code figurant dans d'autres réponses, ce code offre cette combinaison de fonctionnalités:
// format_date(date, pattern, utc)
// - date
// - a JavaScript Date object
// - use "new Date()" for current time
// - pattern
// - a string with embedded {codes} like
// "{year4}-{month02}-{day02}: {dayname3}"
// see format_date_funcs below for complete list
// - any other letters go through unchanged
// - utc
// - if true, shows date in UTC time "zone"
// - if false/omitted, shows date in local time zone
//
var month_names =
[
"January", "February", "March", "April", "May", "June", "July",
"August", "September", "October", "November", "December"
];
var day_of_week_names =
[
"Sunday", "Monday", "Tuesday",
"Wednesday", "Thursday", "Friday", "Saturday"
];
function space_pad2(num)
{
return num < 10 ? " " + num : num;
}
function zero_pad2(num)
{
return num < 10 ? "0" + num : num;
}
function space_pad3(num)
{
if (num < 10)
return " " + num;
else if (num < 100)
return " " + num;
else
return num;
}
function zero_pad3(num)
{
if (num < 10)
return "00" + num;
else if (num < 100)
return "0" + num;
else
return num;
}
var format_date_funcs =
{
// {year4} = '1902'
// {year02} = '02'
//
'year4': function(date, utc)
{
var year = utc ? date.getUTCFullYear() : date.getFullYear();
return year;
},
'year02': function(date, utc)
{
var year = utc ? date.getUTCFullYear() : date.getFullYear();
return year.toString().substr(2,2);
},
// {month} = '1' - '12'
// {month2} = ' 1' - '12' (space padded)
// {month02} = '01' - '12'
//
'month': function(date, utc)
{
var month = utc ? date.getUTCMonth() : date.getMonth(); // [0,11]
return month + 1;
},
'month2': function(date, utc)
{
var month = utc ? date.getUTCMonth() : date.getMonth(); // [0,11]
return space_pad2(month + 1);
},
'month02': function(date, utc)
{
var month = utc ? date.getUTCMonth() : date.getMonth(); // [0,11]
return zero_pad2(month + 1);
},
// {monthname} = 'January'
// {monthname3} = 'Jan'
//
'monthname': function(date, utc)
{
var month = utc ? date.getUTCMonth() : date.getMonth(); // [0,11]
return month_names[month];
},
'monthname3': function(date, utc)
{
var month = utc ? date.getUTCMonth() : date.getMonth(); // [0,11]
return month_names[month].substr(0, 3);
},
// {day} = '1' - '31'
// {day2} = ' 1' - '31' (space padded)
// {day02} = '01' - '31'
//
'day': function(date, utc)
{
var date = utc ? date.getUTCDate() : date.getDate(); // [1,31]
return date;
},
'day2': function(date, utc)
{
var date = utc ? date.getUTCDate() : date.getDate(); // [1,31]
return space_pad2(date);
},
'day02': function(date, utc)
{
var date = utc ? date.getUTCDate() : date.getDate(); // [1,31]
return zero_pad2(date);
},
// {dayname} = 'Tuesday'
// {dayname3} = 'Tue'
//
'dayname': function(date, utc)
{
var day = utc ? date.getUTCDay() : date.getDay(); // [0,6]
return day_of_week_names[day];
},
'dayname3': function(date, utc)
{
var day = utc ? date.getUTCDay() : date.getDay(); // [0,6]
return day_of_week_names[day].substr(0,3);
},
// {24hour} = '0' - '23'
// {24hour2} = ' 0' - '23' (space padded)
// {24hour02} = '00' - '23'
//
'24hour': function(date, utc)
{
var hour = utc ? date.getUTCHours() : date.getHours(); // [0,23]
return hour;
},
'24hour2': function(date, utc)
{
var hour = utc ? date.getUTCHours() : date.getHours(); // [0,23]
return space_pad2(hour);
},
'24hour02': function(date, utc)
{
var hour = utc ? date.getUTCHours() : date.getHours(); // [0,23]
return zero_pad2(hour);
},
// {12hour} = '1' - '12'
// {12hour2} = ' 1' - '12' (space padded)
// {12hour02} = '01' - '12'
// {ampm} = 'am' or 'pm'
// {AMPM} = 'AM' or 'PM'
//
'12hour': function(date, utc)
{
var hour = utc ? date.getUTCHours() : date.getHours(); // [0,23]
hour = hour % 12; // [0,11]
if (0 === hour) hour = 12;
return hour;
},
'12hour2': function(date, utc)
{
var hour = utc ? date.getUTCHours() : date.getHours(); // [0,23]
hour = hour % 12; // [0,11]
if (0 === hour) hour = 12;
return space_pad2(hour);
},
'12hour02': function(date, utc)
{
var hour = utc ? date.getUTCHours() : date.getHours(); // [0,23]
hour = hour % 12; // [0,11]
if (0 === hour) hour = 12;
return zero_pad2(hour);
},
'ampm': function(date, utc)
{
var hour = utc ? date.getUTCHours() : date.getHours(); // [0,23]
return (hour < 12 ? 'am' : 'pm');
},
'AMPM': function(date, utc)
{
var hour = utc ? date.getUTCHours() : date.getHours(); // [0,23]
return (hour < 12 ? 'AM' : 'PM');
},
// {minute} = '0' - '59'
// {minute2} = ' 0' - '59' (space padded)
// {minute02} = '00' - '59'
//
'minute': function(date, utc)
{
var minute = utc ? date.getUTCMinutes() : date.getMinutes(); // [0,59]
return minute;
},
'minute2': function(date, utc)
{
var minute = utc ? date.getUTCMinutes() : date.getMinutes(); // [0,59]
return space_pad2(minute);
},
'minute02': function(date, utc)
{
var minute = utc ? date.getUTCMinutes() : date.getMinutes(); // [0,59]
return zero_pad2(minute);
},
// {second} = '0' - '59'
// {second2} = ' 0' - '59' (space padded)
// {second02} = '00' - '59'
//
'second': function(date, utc)
{
var second = utc ? date.getUTCSeconds() : date.getSeconds(); // [0,59]
return second;
},
'second2': function(date, utc)
{
var second = utc ? date.getUTCSeconds() : date.getSeconds(); // [0,59]
return space_pad2(second);
},
'second02': function(date, utc)
{
var second = utc ? date.getUTCSeconds() : date.getSeconds(); // [0,59]
return zero_pad2(second);
},
// {msec} = '0' - '999'
// {msec3} = ' 0' - '999' (space padded)
// {msec03} = '000' - '999'
//
'msec': function(date, utc)
{
var msec =
utc ? date.getUTCMilliseconds() : date.getMilliseconds(); // [0,999]
return msec;
},
'msec3': function(date, utc)
{
var msec =
utc ? date.getUTCMilliseconds() : date.getMilliseconds(); // [0,999]
return space_pad3(msec);
},
'msec03': function(date, utc)
{
var msec =
utc ? date.getUTCMilliseconds() : date.getMilliseconds(); // [0,999]
return zero_pad3(msec);
},
// {open} = '{' (in case you actually want '{' in the output)
//
'open': function(date, utc)
{
return '{';
},
// {close} = '}' (in case you actually want '}' in the output)
//
'close': function(date, utc)
{
return '}';
},
};
function format_date(date, pattern, utc)
{
if (!pattern)
{
pattern = '{month}/{day}/{year4}';
}
var ret = '';
while (pattern.length > 0)
{
var s = pattern.indexOf('{');
var e = pattern.indexOf('}');
//console.log('s ' + s + ' e ' + e);
if (-1 !== s && -1 !== e && s < e)
{
// - there is a well-formed {foo} in range [s,e]
// - first we emit range [0,s) as literal
}
else
{
// - rest of string has no {} or has malformed }{ or { or }
// - just emit the rest of the string as literal and be done
s = pattern.length;
}
// emit range [0,s) as literal
if (s > 0)
{
ret += pattern.substr(0, s);
pattern = pattern.substr(s);
e -= s;
s = 0;
}
if (0 === pattern.length) break;
// emit range [s=0,e] by evaluating code
console.assert(0 === s); // position of {
console.assert(e > 0); // position of }
console.assert('{' === pattern.substr(s, 1));
console.assert('}' === pattern.substr(e, 1));
var code = pattern.substr(1,e-1);
var func = format_date_funcs[code];
console.assert(func);
ret += func(date, utc);
pattern = pattern.substr(e+1);
}
return ret;
}
if (1) // test format_date
{
var fmt = '[';
for (var func in format_date_funcs)
{
if (!format_date_funcs.hasOwnProperty(func)) continue;
fmt += '{' + func + '}/';
}
fmt += ']';
var now = new Date();
console.log(fmt);
console.log(format_date(now, fmt, false /*utc*/));
console.log(format_date(now, fmt, true /*utc*/));
}
Vous n'avez besoin d'aucune bibliothèque, il vous suffit d'extraire les composants de date et de construire la chaîne. Voici comment obtenir le format YYYY-MM-DD
. Notez également l'index du mois "Janvier est 0, Février est 1, etc."
// @flow
type Components = {
day: number,
month: number,
year: number
}
export default class DateFormatter {
// YYYY-MM-DD
static YYYY_MM_DD = (date: Date): string => {
const components = DateFormatter.format(DateFormatter.components(date))
return `${components.year}-${components.month}-${components.day}`
}
static format = (components: Components) => {
return {
day: `${components.day}`.padStart(2, '0'),
month: `${components.month}`.padStart(2, '0'),
year: components.year
}
}
static components = (date: Date) => {
return {
day: date.getDate(),
month: date.getMonth() + 1,
year: date.getFullYear()
}
}
}
Utilisation:
thisDate = new Date(parseInt(jsonDateString.replace('/Date(', '')));
formattedDate = (thisDate.getMonth() + 1) + "/" + (thisDate.getDate()+1) + "/" + thisDate.getFullYear();
Cela prend un JSON date, "/ Date (1429573751663) /" et produit comme chaîne formatée:
"21/04/2015"