Làm cách nào để in ngày hôm nay bằng html?

Khi bạn đang phát triển các ứng dụng web, bạn có thể cần bao gồm ngày hiện tại mà một thao tác cụ thể được thực hiện

Ví dụ: khi gửi dữ liệu qua một biểu mẫu, bạn có thể muốn bao gồm ngày dữ liệu được tạo hoặc khi biểu mẫu được gửi

Trong bài viết này, chúng ta sẽ tìm hiểu cách dễ dàng lấy ngày hiện tại (ngày hôm nay) bằng JavaScript từ đầu. Chúng ta cũng sẽ học cách làm điều này với một thư viện bên ngoài như Moment. js, một thư viện ngày JavaScript phổ biến

Chỉ cần lưu ý - nói chung, không nên sử dụng thư viện bên ngoài cho thao tác như thế này. Nhưng nếu bạn đã cài đặt một thư viện trong dự án của mình hoặc bạn đang sử dụng nó cho các hoạt động khác trong ứng dụng của mình, thì bạn có thể sử dụng nó

Cách lấy ngày hiện tại trong JavaScript

Trong JavaScript, chúng ta có thể dễ dàng lấy ngày hoặc giờ hiện tại bằng cách sử dụng đối tượng new Date(). Theo mặc định, nó sử dụng múi giờ của trình duyệt của chúng tôi và hiển thị ngày ở dạng chuỗi văn bản đầy đủ, chẳng hạn như "Fri Jun 17 2022 10. 54. 59 GMT+0100 (Giờ mùa hè của Anh)" chứa ngày, giờ và múi giờ hiện tại

const date = new Date();
console.log(date); // Fri Jun 17 2022 11:27:28 GMT+0100 (British Summer Time)

Hãy xem cách chúng ta có thể chỉ trích xuất ngày từ chuỗi dài này. Chúng tôi sẽ làm cho nó dễ đọc và dễ hiểu hơn đối với người dùng bằng cách sử dụng một số phương thức JavaScript hoạt động trên một đối tượng ngày tháng

Cách sử dụng Phương thức ngày JavaScript

Đối tượng ngày tháng hỗ trợ nhiều phương thức ngày tháng, nhưng đối với bài viết này, chúng ta chỉ cần ngày hiện tại và sẽ chỉ sử dụng ba phương thức

• getFullYear() – chúng tôi sẽ sử dụng phương pháp này để lấy năm ở dạng số có bốn chữ số (yyyy), ví dụ: 2022
• getMonth() – Nó lấy tháng ở dạng số (0-11), ví dụ 2 cho tháng 3 vì nó là chỉ số dựa trên số 0 (có nghĩa là nó bắt đầu từ 0)

• const date = new Date();
  
  let day = date.getDate();
  let month = date.getMonth() + 1;
  let year = date.getFullYear();
  
  // This arrangement can be altered based on how we want the date's format to appear.
  let currentDate = `${day}-${month}-${year}`;
  console.log(currentDate); // "17-6-2022"

  0 – lấy ngày ở dạng số (1-31)

Bây giờ chúng ta hãy đặt tất cả những thứ này lại với nhau dựa trên định dạng mà chúng ta muốn ngày của mình xuất hiện

const date = new Date();

let day = date.getDate();
let month = date.getMonth() + 1;
let year = date.getFullYear();

// This arrangement can be altered based on how we want the date's format to appear.
let currentDate = `${day}-${month}-${year}`;
console.log(currentDate); // "17-6-2022"

Ghi chú. Chúng tôi đã thêm một vào giá trị của

const date = new Date();

let day = date.getDate();
let month = date.getMonth() + 1;
let year = date.getFullYear();

// This arrangement can be altered based on how we want the date's format to appear.
let currentDate = `${day}-${month}-${year}`;
console.log(currentDate); // "17-6-2022"

1 vì nó được lập chỉ mục dựa trên

const date = new Date();

let day = date.getDate();
let month = date.getMonth() + 1;
let year = date.getFullYear();

// This arrangement can be altered based on how we want the date's format to appear.
let currentDate = `${day}-${month}-${year}`;
console.log(currentDate); // "17-6-2022"

2. Giả sử chúng tôi không muốn sử dụng dấu gạch ngang (-) giữa các giá trị ngày của mình, tất cả những gì chúng tôi phải làm là thay thế dấu gạch ngang bằng bất kỳ thứ gì chúng tôi thích

Cách sử dụng Phương thức toJSON()

Chúng ta vừa xem cách lấy ngày hiện tại bằng các phương thức ngày. Bây giờ hãy xem cách sử dụng phương thức

const date = new Date();

let day = date.getDate();
let month = date.getMonth() + 1;
let year = date.getFullYear();

// This arrangement can be altered based on how we want the date's format to appear.
let currentDate = `${day}-${month}-${year}`;
console.log(currentDate); // "17-6-2022"

3, phương thức này trả về ngày của chúng ta ở định dạng

const date = new Date();

let day = date.getDate();
let month = date.getMonth() + 1;
let year = date.getFullYear();

// This arrangement can be altered based on how we want the date's format to appear.
let currentDate = `${day}-${month}-${year}`;
console.log(currentDate); // "17-6-2022"

4 bên cạnh định dạng thời gian,

const date = new Date();

let day = date.getDate();
let month = date.getMonth() + 1;
let year = date.getFullYear();

// This arrangement can be altered based on how we want the date's format to appear.
let currentDate = `${day}-${month}-${year}`;
console.log(currentDate); // "17-6-2022"

5

________số 8_______

Vì chúng tôi chỉ muốn ngày hiện tại, chúng tôi có thể sử dụng phương thức

const date = new Date();

let day = date.getDate();
let month = date.getMonth() + 1;
let year = date.getFullYear();

// This arrangement can be altered based on how we want the date's format to appear.
let currentDate = `${day}-${month}-${year}`;
console.log(currentDate); // "17-6-2022"

6 theo cách này để lấy 10 ký tự đầu tiên

let currentDate = new Date().toJSON().slice(0, 10);
console.log(currentDate); // "2022-06-17"

Cách sử dụng toLocaleDateString()

Đây là một phương thức đơn giản khác trả về đối tượng ngày tháng dưới dạng một chuỗi sử dụng các quy ước cục bộ. Ví dụ: định dạng ngày khác nhau giữa các ngôn ngữ và phương thức này chấp nhận một đối số để sửa lỗi đó

Hãy bắt đầu bằng cách chuyển một đối số

let date = new Date().toLocaleDateString();
console.log(date); // 6/17/2022

Giả sử chúng ta muốn thời gian ở Đức

let date = new Date().toLocaleDateString("de-DE");
console.log(date); // 17.6.2022

Ghi chú. Chúng tôi có thể lấy một danh sách cho tất cả các mã ngôn ngữ ở đây

Cách sử dụng khoảnh khắc. js

Khoảng khăc. js là một trong những gói ngày phổ biến nhất dành cho mọi người và chúng tôi cũng có thể sử dụng nó để lấy ngày hiện tại

Miễn là bạn có Khoảnh khắc. js được cài đặt trong dự án của bạn, tất cả những gì bạn cần làm là lấy ngày hiện tại như sau

var date = moment();

var currentDate = date.format('D/MM/YYYY');
console.log(currentDate); // "17/06/2022"

Chúng tôi cũng có thể thao tác dựa trên cách chúng tôi muốn định dạng của ngày xuất hiện

Phần kết luận

Trong bài viết này, chúng ta đã tìm hiểu về các cách tiếp cận khác nhau để lấy ngày hiện tại chỉ bằng JavaScript hoặc với thư viện JavaScript bên ngoài

Bạn có thể đọc thêm về cách bạn có thể dễ dàng định dạng ngày tại đây

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

---

Joel Olawanle

Nhà phát triển Frontend & Người viết kỹ thuật

---

Nếu bạn đọc đến đây, hãy tweet cho tác giả để cho họ thấy bạn quan tâm. Tweet một lời cảm ơn

Học cách viết mã miễn phí. Chương trình giảng dạy mã nguồn mở của freeCodeCamp đã giúp hơn 40.000 người có được việc làm với tư cách là nhà phát triển. Bắt đầu

Làm cách nào để hiển thị ngày hiện tại trong hộp văn bản HTML?

Thẻ nào được sử dụng để hiển thị ngày hôm nay?