Bạn đang muốn lấy ngày giờ hiện tại bằng javascript mà chưa biết cách làm? Vậy bài viết này là dành cho bạn đấy. Nay mình sẽ hướng đẫn chi tiết cách lấy được ngày giờ hiện tại bằng javascript và làm một chiếc đồng hồ số bằng Javascript.
Để lấy được ngày giờ hiện tại thì trước tiên bạn cần khởi tạo một đối tượng Date trong javascript
Vì đây là một đối tượng nên cần sử dụng từ khóa new. Bây giờ bạn chỉ cần log ra là chũng ta có thể thấy được ngày giờ hiện tại rồi nhưng bài viết này chưa kết thúc cho bạn nào muốn lấy riêng ngày, tháng, thứ và năm.
Lấy giờ bằng phương thức getHour()
Muốn có được giờ hiện tại thì mình sẽ dùng phương thức getHour() phương thức này sẽ trả về số giờ dạng 24h (0-23).
Nếu các bạn muốn lấy thêm số 0 đằng trước cho các giờ chỉ có một chữ số như 1, 2, 3… thành 01, 02, 03 thì các bạn có thể dùng phương thức padStart().
Lấy phút bằng phương thức getMinutes()
Tương tự như lấy giờ chỉ khác mình sẽ dùng phương thức getMinutes() phương thức này sẽ trả về phút trong giờ (0-59).
Bạn cũng muốn thêm số 0 đằng trước thì vẫn có thể dùng các trên tương tự nhé.
Lấy giây bằng phương thức getSeconds()
Với giây mình sẽ sử dụng phương thức getSeconds() nó trả về số giây trong phút (0-59).
Bạn vẫn có thể dụng các trên để thêm số 0 đằng trước nhé.
Lấy thứ bằng phương thức getDay()
Lấy thừ thì mình sẽ sử dụng phương thức getDay() phương thức này trả về các ngày trong tuần (0-6) với 0 sẽ là thứ 2 và 6 sẽ tương ứng với chủ nhật nhé.
Nhưng có bạn sẽ muốn kiểu lấy như là thứ hai, thứ ba… đúng không. Vậy thì bạn có thể thử các này nhé, trước tiên bạn hay tạo cho mình một array trong array chứa các thứ, do phương thức “getDay()” trả về (0-6) bạn có thể lấy đó làm index để lấy ra được phần tử trong array.
Lấy ngày bằng phương thức getDate()
Phương thức getDate() sẽ trả về các ngày trong tháng (1-31).
Lấy tháng bằng phương thức getMonth()
Phương thức getMonth() sẽ lấy được tháng, nó sẽ trả về các tháng trong năm (0-11).
Các bạn cũn có thể dùng các tương tương như lấy thức để lấy ra tháng bằng chữ nhé.
Lấy năm bằng phương thức getFullYear()
Lấy năm thì sử dụng phương thức getFullYear() với hàm này sẽ trả về đầy đủ năm theo dạng YYYY.
Mình đã lược qua các hàm lấy được giờ, phút, giây, này tháng, năm hiện tại rồi, vậy nên mĩnh sẽ áp nó để tạo ra một chiếc đồng hồ số, các bạn có thể tham khảo nhé. source mình để ở dưới trang web.
Tạo đồng hồ số bằng javascript
Phần HTML liên quan đến css mình để cho các bạn tham khảo.
Đây là phần css nếu bạn muốn có một giao diện đồng hồ giống mình.
Phần Javascript mình có dùng setInterval để đoạn code sẽ tự chạy sau 500 miliseconde nhé, còn mọi thứ sẽ hoạt động như trên mình đã nói.
Sau khi copy và chạy nó bạn sẽ nhận được một giao diện đồng hồ số hoàn chỉnh và thẩm mĩ nhé.
Phần kết
Tất cả nhưng phương thức trên sẽ giúp bạn lấy được ngày giờ hiện tại và cụ thể cho bạn dễ dàng tạo ra một chiếc đồng hồ rồi. Việc của bạn bây giờ là tự thực hành và tạo ra một chiếc đồng hồ cho riêng mình.