웹 사이트에서 현재 연도를 인쇄하는 가장 짧은 방법


232

바닥 글에 저작권 날짜가 하드 코딩 된 정적 HTML 페이지 수백 개를 업데이트해야합니다. 매년 자동으로 업데이트되는 JavaScript로 바꾸고 싶습니다.

현재 나는 다음을 사용하고 있습니다 :

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

이것이 가능한 한 짧습니까?

답변:


542

내가 얻을 수있는 가장 짧은 것은 다음과 같습니다.

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

그것은 내가 실행 한 모든 브라우저에서 작동합니다.

내가 도착한 방법 :

  • 변수 없이도 getFullYear새로 생성 된을 직접 호출 할 수 있습니다 Date. new Date().getFullYear()조금 이상하게 보일지 모르지만 신뢰할 만합니다. new Date()부분이 먼저 수행 된 다음 .getFullYear().
  • typeJavaScript가 기본값이므로을 (를) 삭제할 수 있습니다 . 이것은 심지어 HTML5 사양의 일부로 문서화되어 있으며 ,이 경우 브라우저가 이미 수행 한 작업을 작성하고있을 가능성이 있습니다.
  • JavaScript에는 "자동 세미콜론 삽입"기능이 있기 때문에 세미콜론을 마지막에 한 줄 더 추가 할 수 있습니다. 일반적으로 멸시 하고 반대 하는 기능 이지만이 특정 사용 사례에서는 충분히 안전해야합니다.

JavaScript가 활성화 된 브라우저에서만 작동합니다. 이상적으로는 일 sed년에 한 번 오프라인 배치 작업 ( * nix의 스크립트 등)으로 처리하는 것이 더 좋지만 JavaScript 솔루션을 원한다면 최대한 짧습니다. (이제 나는 운명에 가고 유혹했다.)


1
2019 년에는 모든 페이지 내용을 다시 씁니다. 뭔가 빠졌습니까?
— 시스템 재부팅 프로그램

2
@SystemsRebooter- document.write초기 구문 분석 단계 (위에 표시된 것처럼 <script>...</script>태그 또는 태그 가 있거나 .js로드 되지 않은 파일) 에서 인라인 컨텐츠 에만 사용할 수 있습니다 . 페이지가 완전히 구문 분석되면 문서 스트림이 닫히고 다시 열면 문서가 새 것으로 대체됩니다. 기본 구문 분석이 완료된 후 1 년을 추가하려면 DOM을 사용하려고합니다. (이것은 변화가 아니며 항상 이런 식으로 진행되었습니다.)script deferasyncdocument.write
— TJ Crowder

44

TJ의 대답은 훌륭하지만 HTML이 이미 렌더링되고 document.write 스크립트가 모든 페이지 내용을 날짜 연도로 덮어 쓰는 하나의 시나리오에 부딪 쳤습니다.

이 시나리오에서는 다음 코드를 사용하여 기존 요소에 텍스트 노드를 추가 할 수 있습니다.

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

예-좋은 해결책입니다! 닫는 body 태그 바로 앞에 또는 html body 끝에있는 다른 js로 스크립트 스 니펫을 이동하는 것이 좋습니다.
— Christian Michael

createTextNode()<br>HTML로 노드를 만드는 방법 과 같이 HTML을 해석하지 않습니까?
— rubo77

19

내년에 현재 연도 (예 : 2017)를 시작 연도로 사용하여 미래에 시간 프레임을 포함 시키려면 다음과 같이 표시됩니다 : "© 2017-2018, Company.", 다음 코드를 사용하십시오. . 매년 자동으로 업데이트됩니다.

&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.

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

1
나는 <script>가 짧다는 것을 알고 있지만 (다른 답변 참조) 그의 최신 버전이며 항상 작동합니다. 사실, 다른 하나는 작동하지 않는 WP에 인스턴스가 있었지만 문제는 없었습니다. 왜 WP가 이것에 대해 문제를 일으키는 지 잘 모르겠습니다. 요즘에는 결국 스크립트는 기본적으로 js로 설정되지만 여전히 그렇습니다.
— Malachi

9

JS 솔루션은 훌륭하게 작동하지만 서버 측 솔루션에 대해 조언합니다. 내가 확인한 사이트 중 일부는 전체 페이지가 비어있는 문제가 있었고 한 해만 한 번만 보였습니다.

그 이유는 document.write가 실제로 전체 문서를 작성 했기 때문입니다 .

나는 친구에게 서버 측 솔루션을 구현하도록 요청했으며 그에게 도움이되었습니다. PHP의 간단한 코드

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

즐겨!


1
해결책은 매우 간단하지만 문제는 JavaScript와 관련이 있다는 것입니다.
— Mo.

2
ㅋ! 내가 이것을 게시했을 때 해결책이 이미 주어졌습니다. 아직도 나는 사람들에게 다른 방법이 있다는 것을 알기를 원했습니다! 미래에 나와 같은 누군가를 돕기를 바랍니다!
— Arcanyx

같은 생각을 가진 해결책이 없을 때 대안을 찾아야한다는 점에 동의합니다. 다운 투표에주의하십시오 😉
— Mo.

서버 측 솔루션이 Node.js와 JavaScript 인 경우 어떻게해야합니까?
— rorymorris89

2
페이지가 비어 있으면 document.writeDOM이 이미로드 된 후에 사용 된 것입니다. 해결책은 document.write모든 DOM이로드 된 후에 는 사용하지 않거나 전혀 사용 하지 않는 document.write것입니다.
— user4642212

8

AD와 BC 모두에서 작동하는 가장 짧은 가장 책임있는 버전은 다음과 같습니다.

[드럼 롤 ...]

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

그게 다야. 허용 된 답변보다 6 바이트 짧은.

ES5와 호환 가능해야하는 경우 다음과 같이 해결할 수 있습니다.

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

4
사용자가 1000 AD 이전으로 돌아 가면 어떨까요? 또는 사용자가 9999 AD 이상의 앱을 사용하는 경우 어떻게됩니까? #responsibleCode # NotAnotherY2K;)
— Nick Steele

3
@NickSteele이 시점에서 순수한 자바 스크립트를 작성하지 않기를 바랍니다.
— Michael McQuade

1

이것이 내가 생각할 수있는 가장 좋은 해결책은 순수한 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();
        }
    })();
});


1

React.js의 경우 다음은 바닥 글에서 나를 위해 일한 것입니다 ...

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

당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.