blocks|key|1052658|text|TJ的回答很好，但是我遇到了一个场景，在这个场景中，我的HTML语言已经被呈现，并且document.write脚本将仅用日期年份覆盖所有页面内容。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1052659|对于此方案，您可以使用以下代码将文本节点附加到现有元素：|1052660|<div>
++++&copy;
++++<span+id="copyright">
++++++++<script>document.getElementById('copyright').appendChild(document.createTextNode(new+Date().getFullYear()))</script>
++++</span>
++++Company+Name
</div>|code-block|syntax|javascript|1052661|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>TJ's answer is excellent but I ran into one scenario where my HTML was already rendered and the document.write script would overwrite all of the page contents with just the date year.</p>

<p>For this scenario, you can append a text node to the existing element using the following code:</p>

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


blocks|key|1052596|text|<script+type="text/javascript">document.write(new+Date().getFullYear());</script>|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1052597|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>&lt;script type="text/javascript"&gt;document.write(new Date().getFullYear());&lt;/script&gt;
</code></pre>


blocks|key|1052693|text|这里是终极最短，最负责任的版本，甚至可以同时工作在AD和BC上。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1052694|鼓声..。|1052695|<script>document.write(Date().split`+`[3])</script>|code-block|syntax|javascript|1052696|就这样。比接受的答案短6个字节。|1052697|如果您需要与ES5兼容，您可以满足于：|1052698|<script>document.write(Date().split('+')[3])</script>|1052699|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|R|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|S|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|T|8|@]|9|@]|A|$]]|$1|K|3|L|5|6|7|U|8|@]|9|@]|A|$]]|$1|M|3|N|5|F|7|V|8|@]|9|@]|A|$G|H]]|$1|O|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|P|$]]

<p>Here's the ultimate shortest most responsible version that even works both AD and BC.</p>

<p>[drum rolls...]</p>

<pre><code>&lt;script&gt;document.write(Date().split` `[3])&lt;/script&gt;
</code></pre>

<p>That's it. 6 Bytes shorter than the accepted answer.</p>

<p>If you need to be ES5 compatible, you can settle for:</p>

<pre><code>&lt;script&gt;document.write(Date().split(' ')[3])&lt;/script&gt;
</code></pre>


blocks|key|1052747|text|​|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1052748|<div>&copy;<script>document.write(new+Date().getFullYear());</script>,+Company.
</div>|code-block|syntax|javascript|1052749|1052750|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|J|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|K|8|@]|9|@]|A|$E|F]]|$1|G|3|4|5|6|7|L|8|@]|9|@]|A|$]]|$1|H|3|-4|5|6|7|M|8|@]|9|@]|A|$]]]|I|$]]

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div&gt;&amp;copy;&lt;script&gt;document.write(new Date().getFullYear());&lt;/script&gt;, Company.
&lt;/div&gt;</code></pre>
</div>
</div>
</p>


blocks|key|838054|text|对于React.js，以下是我在页脚中的工作……|type|unstyled|depth|inlineStyleRanges|entityRanges|data|838055|render()+{
++++const+yearNow+=+new+Date().getFullYear();
++++return+(
++++<div+className="copyright">&copy;+Company+2015-{yearNow}</div>
);
}|code-block|syntax|javascript|838056|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>For React.js, the following is what worked for me in the footer...</p>

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


blocks|key|838001|text|这是我能想到的与纯JavaScript一起工作的最好的解决方案。您还可以设置元素的样式，因为它可以在CSS中作为目标。只需添加到年份的位置，它将自动更新。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|838002|//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();
++++++++}
++++})();
});|code-block|syntax|javascript|838003|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>This is the best solution I can think of that will work with pure JavaScript. You will also be able to style the element as it can be targeted in CSS. Just add  in place of the year and it will automatically be updated.</p>

<pre><code>//Wait for everything to load first
window.addEventListener('load', () =&gt; {
    //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();
        }
    })();
});
</code></pre>


blocks|key|838102|text|使用document.write不是一种好的做法。您可以通过按here来了解有关document.write的更多信息。这是一个比较友好的JavaScript解决方案。是的，有关于InnerHTML是如何糟糕的研究，正在研究一种更友好的解决方案。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|838103|document.getElementById("year").innerHTML+=+(new+Date().getFullYear());|code-block|syntax|javascript|838104|↑JavaScript|838105|↓HTML|838106|<p>Company+&copy;+<span+id="year"></span>+All+Rights+Reserved.</p>|838107|这里有一个JSFiddle来测试它。与其使用JavaScript，就我个人而言，我建议用PHP来编写本年度的代码，使用PHP比使用JavaScript要安全得多。|838108|<?php+echo+date("Y");+?>|838109|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/questions/802854/why-is-document-write-considered-a-bad-practice|1|https://jsfiddle.net/nkcqxg9e/^0|2|E|V|4|0|0|0|0|0|0|5|8|1|0|0^^$0|@$1|2|3|4|5|6|7|14|8|@$9|15|A|16|B|C]]|D|@$9|17|A|18|1|19]]|E|$]]|$1|F|3|G|5|H|7|1A|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|1B|8|@]|D|@]|E|$]]|$1|M|3|N|5|6|7|1C|8|@]|D|@]|E|$]]|$1|O|3|P|5|H|7|1D|8|@]|D|@]|E|$I|J]]|$1|Q|3|R|5|6|7|1E|8|@]|D|@$9|1F|A|1G|1|1H]]|E|$]]|$1|S|3|T|5|H|7|1I|8|@]|D|@]|E|$I|J]]|$1|U|3|-4|5|6|7|1J|8|@]|D|@]|E|$]]]|V|$W|$5|X|Y|Z|E|$10|11]]|12|$5|X|Y|Z|E|$10|13]]]]

<p>It's not a good practice to use <code>document.write</code>. You can learn more about document.write by pressing <a href="https://stackoverflow.com/questions/802854/why-is-document-write-considered-a-bad-practice">here</a>. Here's a somewhat friendly JavaScript solution. And yes, there are studies on how InnerHTML is bad, working on a more friendly solution.</p>
<pre><code>document.getElementById(&quot;year&quot;).innerHTML = (new Date().getFullYear());
</code></pre>
<p>↑ JavaScript</p>
<p>↓ HTML</p>
<pre><code>&lt;p&gt;Company &amp;copy; &lt;span id=&quot;year&quot;&gt;&lt;/span&gt; All Rights Reserved.&lt;/p&gt;
</code></pre>
<p>Here's a <a href="https://jsfiddle.net/nkcqxg9e/" rel="nofollow noreferrer">JSFiddle</a> to test it out. Instead of using JavaScript, personally, I'd recommend writing the current year with PHP, it's a lot more safe doing with PHP instead of JavaScript.</p>
<pre><code>&lt;?php echo date(&quot;Y&quot;); ?&gt;
</code></pre>


blocks|key|1052904|text|全年：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1052905|​|1052906|document.getElementById("getyear").innerHTML+=+(new+Date().getFullYear());|code-block|syntax|javascript|1052907|<span+id="getyear"></span>|1052908|1052909|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|P|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|K|3|C|5|6|7|R|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|M|$]]

<p>Full year:</p>
<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>document.getElementById("getyear").innerHTML = (new Date().getFullYear());</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;span id="getyear"&gt;&lt;/span&gt;</code></pre>
</div>
</div>
</p>


blocks|key|838169|text|如果您的站点多次需要当前年份，您可以这样做：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|838170|​|838171|document.querySelectorAll("copy-year").forEach(el+=>+{
++++el.textContent+=+`${el.textContent}+-+${new+Date().getFullYear()}`;
});|code-block|syntax|javascript|838172|Copyright+Company+<copy-year>1234</copy-year>+©|838173|838174|我知道，这不是最短的路，但它真的很好用。|838175|PS:你需要在你的页面底部有JS或者在脚本标签上使用defer属性。|838176|entityMap^0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|R|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|S|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|T|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|F|7|U|8|@]|9|@]|A|$G|H]]|$1|K|3|C|5|6|7|V|8|@]|9|@]|A|$]]|$1|L|3|M|5|6|7|W|8|@]|9|@]|A|$]]|$1|N|3|O|5|6|7|X|8|@]|9|@]|A|$]]|$1|P|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|Q|$]]

<p>If you need the current year multiple times on your site you can do this:</p>
<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>document.querySelectorAll("copy-year").forEach(el =&gt; {
    el.textContent = `${el.textContent} - ${new Date().getFullYear()}`;
});</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>Copyright Company &lt;copy-year&gt;1234&lt;/copy-year&gt; ©</code></pre>
</div>
</div>
</p>
<p>I know, it is not the shortest way, but it works really good.</p>
<p>PS: You need to have JS on bottom of your page or use defer attribute on script tag.</p>


blocks|key|1052929|text|对于React.js，我们可以在一行中使用-|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1052930|++++return+
++++<div+className="copyright">Company+2015-{new+Date().getFullYear()}</div>|code-block|syntax|javascript|1052931|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>For React.js,
We can use in a single line-</p>
<pre><code>    return 
    &lt;div className=&quot;copyright&quot;&gt;Company 2015-{new Date().getFullYear()}&lt;/div&gt;
    
</code></pre>


<p>I need to update a few hundred static HTML pages that have the copyright date hard coded in the footer. I want to replace it with some JavaScript that will automatically update each year.</p>

<p>Currently I’m using:</p>

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

<p>Is this as short as it gets?</p>


Shortest way to print current year in a website

我需要更新几百个静态HTML页面，这些页面在页脚中硬编码了版权日期。我想用一些每年会自动更新的JavaScript来代替它。目前我使用的是：<script type="text/javascript">var year = new Date();document.write(year.getFullYear());</script>这就是它得到的最短的内容吗？

问在网站中打印当前年份的最快捷方式
EN

回答 10

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在网站中打印当前年份的最快捷方式EN

回答 10

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在网站中打印当前年份的最快捷方式
EN