Найкоротший спосіб друкувати поточний рік на веб-сайті

Мені потрібно оновити кілька сотень статичних HTML-сторінок, які мають чітко закодовані дати авторських прав у нижньому колонтитулі. Я хочу замінити його на якийсь JavaScript, який автоматично оновлюватиметься кожного року.

В даний час я використовую:

<script type="text/javascript">var year = new Date();document.write(year.getFullYear());</script>

Це так коротко, як це стає?

Ось найкоротший, який я можу отримати:

<script>document.write(new Date().getFullYear())</script>

Це буде працювати у всіх браузерах, на які я працював.

Як я потрапив:

• Ви можете просто зателефонувати getFullYearбезпосередньо на новостворену Date, не потребуючи змінної. new Date().getFullYear()може виглядати трохи дивно, але це надійно: new Date()спочатку виконується деталь, потім - .getFullYear().
• Ви можете скинути type, тому що JavaScript є типовим; це навіть задокументовано як частину специфікації HTML5 , яка, ймовірно, у цьому випадку є написанням того, що браузери вже роблять.
• Ви можете залишити крапку з комою для одного додаткового збереженого символу, оскільки JavaScript має "автоматичну вставку крапки з комою" - функцію, яку я зазвичай зневажаю та протидію, але в цьому конкретному випадку використання вона повинна бути достатньо безпечною.

Важливо зауважити, що це працює лише в браузерах, де ввімкнено JavaScript. В ідеалі це краще вирішуватись як пакетне завдання в режимі офлайн ( sedскрипт на * nix тощо) раз на рік, але якщо ви хочете вирішити JavaScript, я думаю, що це якнайшвидше. (Зараз я пішов і спокусив долю.)

Відповідь TJ відмінна, але я зіткнувся з одним сценарієм, коли мій HTML вже був наданий, а скрипт document.write замінив би весь вміст сторінки лише з датою року.

Для цього сценарію ви можете додати текстовий вузол до існуючого елемента, використовуючи наступний код:

<div>
    &copy;
    <span id="copyright">
        <script>document.getElementById('copyright').appendChild(document.createTextNode(new Date().getFullYear()))</script>
    </span>
    Company Name
</div>

Якщо ви хочете включити часовий проміжок у майбутньому, з поточним роком (наприклад, 2017) як початковим, щоб наступний рік виглядав так: "© 2017-2018, компанія.", То використовуйте наступний код . Він автоматично оновлюватиметься щороку:

&copy; Copyright 2017<script>new Date().getFullYear()>2017&&document.write("-"+new Date().getFullYear());</script>, Company.

© Авторські права 2017-2018, Компанія.

Але якщо перший рік вже минув, найкоротший код можна записати так:

&copy; Copyright 2010-<script>document.write(new Date().getFullYear())</script>, Company.

<script type="text/javascript">document.write(new Date().getFullYear());</script>

Рішення JS чудово працює, але я б радив рішення на стороні сервера. На деяких веб-сайтах, які я перевіряв, цей випуск всієї сторінки був порожнім, і лише рік раз його бачили.

Причиною цього став document.write, фактично написаний над усім документом.

Я попросив свого друга впровадити рішення на стороні сервера, і воно працювало на нього. Простий код у php

<?php echo date('Y'); ?>

Насолоджуйтесь!

Ось кінцева найкоротша найвідповідальніша версія, яка працює навіть в AD і BC.

[барабанні рулони ...]

<script>document.write(Date().split` `[3])</script>

Це воно. 6 байт коротше прийнятої відповіді.

Якщо вам потрібно бути сумісним з ES5, ви можете погодитися на:

<script>document.write(Date().split(' ')[3])</script>

Це найкраще рішення, про яке я можу придумати, що буде працювати з чистим JavaScript. Ви також зможете стилізувати елемент, оскільки він може бути націлений у CSS. Просто додайте замість року, і він автоматично оновлюватиметься.

//Wait for everything to load first
window.addEventListener('load', () => {
    //Wrap code in IIFE 
    (function() {
        //If your page has an element with ID of auto-year-update the element will be populated with the current year.
        var date = new Date();
        if (document.querySelector("#auto-year-update") !== null) {
            document.querySelector("#auto-year-update").innerText = date.getFullYear();
        }
    })();
});

Для React.js наступним є те, що працювало для мене в нижньому колонтитулі ...

render() {
    const yearNow = new Date().getFullYear();
    return (
    <div className="copyright">&copy; Company 2015-{yearNow}</div>
);
}

згідно з хромованим аудитом

Для користувачів на повільних з'єднаннях зовнішні скрипти, що динамічно вводяться через, document.write()можуть затримати завантаження сторінки на десятки секунд.

https://web.dev/no-document-write/?utm_source=lighthouse&utm_medium=devtools

тому рішення без помилок:

(new Date).getFullYear();