Tự động cập nhật năm hiện tại ở footer là một trong những việc dễ nhất. Rất tiếc, nhiều chủ trang web không biết việc hiển thị năm hiện tại rất quan trọng, cả vì lý do bản quyền và để người dùng biết trang web vẫn hoạt động.
Đây là cách HTML trông trong footer trên hầu hết các trang cũ, thậm chí cả một số trang hiện đại:
<span>© 2018 Company Name</span>- Ký hiệu bản quyền ©.
- Năm hiện tại.
- Tên công ty.
Với cách dùng timestamp tĩnh này, chủ trang phải chỉnh sửa năm hiển thị thủ công mỗi năm. Điều này không thực tế.
Không phải trang nào cũng có Dashboard thân thiện để chỉnh sửa footer dễ dàng. Chủ trang phải tự sửa file HTML hoặc thuê người làm.
Đây là lãng phí thời gian và tài nguyên.
Timestamp lỗi thời có thể làm thương hiệu xấu đi
Rất tiếc, không hiển thị năm hiện tại làm trang web trông lỗi thời — ngay cả khi nó không phải. Nếu bạn vào một trang hôm nay, nhưng năm trên trang ghi 2015, bạn nghĩ gì?
Chính xác. Bạn sẽ thắc mắc trang web còn hoạt động không.
Sau hôm nay, bạn sẽ không bao giờ phải lo lắng về vấn đề này trên trang của mình hoặc khách hàng.
Hiển thị năm hiện tại với phương thức getFullYear() của JavaScript
Thay vì dùng timestamp tĩnh như HTML trên, hãy làm cho nó động bằng cách thêm phương thức date gốc của JavaScript, getFullYear(): vào footer.
Trước, thêm mã sau vào console trình duyệt (hoặc trình soạn thảo văn bản có console) để test:
document.write(new Date().getFullYear());Nhấn enter, bạn sẽ thấy năm hiện tại ở góc trên bên trái cửa sổ trình duyệt.
Bạn có thể xem mã hoạt động trong ví dụ CodePen này. Xem cửa sổ console.
Bây giờ biết nó hoạt động, hãy lấy mã getFullYear() từ trên và gói vào footer HTML từ trước:
<span> ©<script>document.write(new Date().getFullYear());</script> Company Name </span>Kết quả:
Chúc mừng, bạn không còn phải lo về việc cập nhật timestamp năm, JavaScript lo từ đây.
Hiển thị cả năm bản quyền gốc và năm hiện tại
Đôi khi bạn muốn hiển thị cả năm hiện tại và năm đăng ký công ty. Có thể để nhấn mạnh năm yêu cầu bản quyền. Không vấn đề gì. Nếu muốn năm bắt đầu là 2016, chỉ thêm 2016- vào mã trên, như sau:
<span> © 2016-<script>document.write(new Date().getFullYear());</script> Company Name </span>