source

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

lovecheck 2022. 10. 30. 17:56
반응형

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

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

현재 사용하고 있는 것:

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

이렇게 짧아요?

년 후,을 할 때, 는 '아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아,아.'Date())new)에서 문자열이 반환되고 아래 원본보다 한 글자 짧은 방법이 반환됩니다.

<script>document.write(/\d{4}/.exec(Date())[0])</script>

의 첫 입니다.Date()년도라고 지정되어 있습니다.(아래의 원래의 답변이 투고되었을 때는, 일반적인 동작이지만, 특정된 동작은 아닙니다.)

물론 이 솔루션은 앞으로 7,979년 동안만 유효합니다(2021년 현재). 10000년 시점에서는 "10000"이 아닌 "1000"으로 표시됩니다.

JavaScript 솔루션을 요청하셨기 때문에, 제가 얻을 수 있는 가장 빠른 방법은 다음과 같습니다.

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

그것은 내가 마주친 모든 브라우저에서 작동할 것이다.

내가 거기까지 간 방법:

  • 전화하시면 .getFullYear '에 직접 접속합니다.Date변수는 필요 없습니다. new Date().getFullYear() 수 수 」 「 」 「 」 、 「 」 、 「 。new Date()파트가 먼저 완성되고, 그 다음에.getFullYear().
  • 해서 수 있어요.typeJavaScript가 디폴트이기 때문에 HTML5 사양의 일부로서 문서화되어 있습니다.이 경우 브라우저가 이미 하고 있는 작업을 기술하고 있을 가능성이 있습니다.
  • JavaScript에는 보통 경멸하고 비난하는 기능인 "자동 세미콜론 삽입"이 있기 때문에 마지막에는 세미콜론을 놓을 수 있습니다. 하지만 이 특정 사용 예에서는 충분히 안전합니다.

자바스크립트 작업Batch Job」)으로하는 것이.sed*nix 등)을 1로 하다.(이제 나는 운명을 시험하러 갔다.)

그러나 정적 파일만 제공할 수 있는 서버를 사용하지 않는 한 템플리트 엔진을 사용하여 서버에서 이 작업을 수행하고 캐시 헤더를 사용하여 날짜를 변경해야 할 때까지 페이지를 캐시하는 것이 좋습니다.이렇게 하면 클라이언트에 JavaScript가 필요하지 않습니다.non-to-no-no-no-no-nodefer/async script, 이가 「」를 사용할 이 있기 입니다).document.writeHTML html html html html html html html html html ） 。

TJ의 답변은 훌륭합니다만, HTML이 이미 렌더링 되어 있는 시나리오와 문서가 있는 시나리오가 있습니다.write 스크립트는 모든 페이지 내용을 날짜 연도만으로 덮어씁니다.

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

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

현재 연도(예: 2017년)를 시작 연도로 하여 내년에 "© 2017-2018, Company"로 표시되도록 향후 기간을 포함하려면 다음 코드를 사용하십시오.매년 자동으로 업데이트됩니다.

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

© Copyright 2017-2018, Company.

그러나 첫 해가 이미 지난 경우, 최단 코드는 다음과 같이 작성될 수 있습니다.

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

JS솔루션은 잘 동작하지만 서버측솔루션에 대해서는 조언해드리겠습니다.제가 확인한 사이트 중에는 페이지 전체가 공백으로 되어 있고, 가끔 1년 밖에 표시되지 않는 것도 있었습니다.

그 이유는 서류 때문이었다.실제로 문서 전체에 걸쳐 쓴 글입니다.

친구에게 서버 측 솔루션을 구현해 달라고 부탁했더니 효과가 있었습니다.php의 간단한 코드

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

맛있게 드세요!

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

AD와 BC를 모두 사용할 수 있는 가장 짧은 버전입니다.

[빵빵...]

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

바로 그겁니다.승인된 답변보다 6바이트 짧습니다.

ES5와 호환성이 필요한 경우 다음을 만족할 수 있습니다.

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

쓰는 않아요.document.write문서에 대한 자세한 내용을 볼 수 있습니다.여기를 눌러 쓰세요.여기 다소 사용하기 쉬운 JavaScript 솔루션이 있습니다.그리고 네, 이너씨가 어떻게 이너씨를HTML은 좋지 않습니다.좀 더 알기 쉬운 솔루션을 사용하고 있습니다.

document.getElementById("year").innerHTML = (new Date().getFullYear());

↑ JavaScript

↓ HTML

<p>Company &copy; <span id="year"></span> All Rights Reserved.</p>

테스트하기 위한 JSFiddle입니다.개인적으로 JavaScript를 사용하는 대신 PHP로 연도를 작성하는 것이 JavaScript 대신 PHP를 사용하는 것이 훨씬 안전합니다.

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


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

React.js의 경우 바닥글에서 다음과 같은 작업을 수행할 수 있습니다.

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

이것은 순수 자바스크립트와 연동되는 최고의 솔루션입니다.또한 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();
        }
    })();
});

크롬 감사에 의하면

접속 속도가 느린 사용자의 경우 외부 스크립트는 다음 명령을 통해 동적으로 삽입됩니다.document.write()는 페이지 로드를 수십 초 지연시킬 수 있습니다.

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

따라서 오류 없는 솔루션은 다음과 같습니다.

(new Date).getFullYear();

받아들여진 답변이 항상 기능하는 것은 아니다

최근 업데이트로 인해 모든 WordPress 바닥글 저작권 날짜가 예전처럼 인라인으로 쓰는 대신 페이지 끝으로 밀리게 되었습니다.그 밖에도 이런 일이 있을 수 있다고 생각합니다만, 이것이 바로 제가 깨달은 점입니다.

여기에 이미지 설명 입력

이 경우 빈 스팬 태그를 만들고 다음과 같이 날짜를 삽입하여 수정할 수 있습니다.

<span id="cdate"></span><script>document.getElementById("cdate").innerHTML = (new Date().getFullYear());</script>

또는 사이트에서 jquery를 유효하게 하고 있는 경우는, 다음과 같이 간단하게 할 수 있습니다.

<span id="cdate"></span><script>$("#cdate").html(new Date().getFullYear());</script>

이것은 Adam Milecki의 대답과 비슷하지만 훨씬 짧다.

상기의 전문가로부터 제공받은 이 문제에 대한 많은 해결책이 있습니다.이하의 솔루션을 사용할 수 있습니다.not block페이지rendering또는not even re-trigger바로 그거에요.

순수 Javascript:

window.addEventListener('load', (
    function () {
        document.getElementById('copyright-year').appendChild(
            document.createTextNode(
                new Date().getFullYear()
            )
        );
    }
));
<div> &copy; <span id="copyright-year"></span></div>

jQuery의 경우:

$(document).ready(function() {
  document.getElementById('copyright-year').appendChild(
    document.createTextNode(
      new Date().getFullYear()
    )
  );
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div> &copy; <span id="copyright-year"></span></div>

연차:

document.getElementById("getyear").innerHTML = (new Date().getFullYear());
<span id="getyear"></span>

사이트에서 현재 연도가 여러 번 필요한 경우 다음을 수행할 수 있습니다.

document.querySelectorAll("copy-year").forEach(el => {
    el.textContent = `${el.textContent} - ${new Date().getFullYear()}`;
});
Copyright Company <copy-year>1234</copy-year> ©

알아요, 그게 가장 빠른 방법은 아니지만, 정말 효과가 좋아요.

PS: 페이지 하단에 JS가 있거나 스크립트 태그에 defer 속성을 사용해야 합니다.

React.js의 경우 한 줄로 사용할 수 있습니다.

    return 
    <div className="copyright">Company 2015-{new Date().getFullYear()}</div>

간단해!

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

언급URL : https://stackoverflow.com/questions/4562587/shortest-way-to-print-current-year-in-a-website

반응형

'source' 카테고리의 다른 글

Ajax 업로드 이미지  (0) 2022.10.30
java.net 를 입수합니다.소켓 타임아웃예외:Android에서 연결 시간이 초과되었습니다.  (0) 2022.10.30
내부 클래스에서 외부 클래스 함수를 호출합니다.  (0) 2022.10.30
php의 데이터를 암호화/복호화하려면 어떻게 해야 합니까?  (0) 2022.10.29
Node.js module.exports의 목적은 무엇이며 어떻게 사용합니까?  (0) 2022.10.29

'source'의 다른글

  • 현재글웹 사이트에서 현재 연도를 인쇄하는 가장 빠른 방법

관련글

댓글

티스토리툴바