एक वेबसाइट में चालू वर्ष को मुद्रित करने का सबसे छोटा तरीका

232

मुझे कुछ सौ स्थिर HTML पृष्ठों को अद्यतन करने की आवश्यकता है, जिनके पास पाद लेख में कॉपीराइट दिनांक हार्ड कोडित है। मैं इसे कुछ जावास्क्रिप्ट के साथ बदलना चाहता हूं जो प्रत्येक वर्ष स्वचालित रूप से अपडेट हो जाएंगे।

वर्तमान में मैं उपयोग कर रहा हूं:

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

क्या यह उतना ही छोटा है जितना इसे मिलता है?

javascript html date

— tpow
स्रोत

542

यहाँ सबसे छोटा है जो मुझे मिल सकता है:

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

मेरे द्वारा चलाए गए सभी ब्राउज़रों में यह काम करेगा।

मैं वहां कैसे पहुंचा:

आप getFullYearसीधे नव-निर्मित पर सीधे कॉल कर सकते हैं Date, चर की कोई आवश्यकता नहीं है। new Date().getFullYear()थोड़ा अजीब लग सकता है, लेकिन यह विश्वसनीय है: new Date()भाग पहले किया जाता है, फिर सबसे पहले .getFullYear()।
आप ड्रॉप कर सकते हैं type, क्योंकि जावास्क्रिप्ट डिफ़ॉल्ट है; यह HTML5 विनिर्देश के भाग के रूप में भी प्रलेखित है , जो इस मामले में संभवतः यह बताता है कि ब्राउज़र पहले से क्या लिख रहा है।
आप एक अतिरिक्त सहेजे गए वर्ण के लिए अर्धविराम को छोड़ सकते हैं, क्योंकि जावास्क्रिप्ट में "स्वचालित अर्धविराम सम्मिलन" है, एक विशेषता जिसे मैं सामान्य रूप से घृणा करता हूं और उसके खिलाफ रेल करता हूं , लेकिन इस विशिष्ट उपयोग के मामले में यह पर्याप्त सुरक्षित होना चाहिए।

यह नोट करना महत्वपूर्ण है कि यह केवल उन ब्राउज़रों पर काम करता है जहां जावास्क्रिप्ट सक्षम है। आदर्श रूप से, यह sedएक वर्ष में एक बार ऑफ़लाइन बैच की नौकरी ( * निक्स, आदि पर स्क्रिप्ट) के रूप में बेहतर होगा , लेकिन यदि आप जावास्क्रिप्ट समाधान चाहते हैं, तो मुझे लगता है कि यह उतना ही छोटा है जितना इसे मिलता है। (मैं चला गया है और भाग्य का परीक्षण किया है।)

— टीजे क्राउडर
स्रोत

1

2019 में यह सभी पृष्ठ सामग्री को फिर से लिखता है। क्या मैं कुछ भूल रहा हूँ?

— सिस्टम रीबूटर

2

@SystemsRebooter - आप केवल document.writeप्रारंभिक पार्सिंग चरण के दौरान इनलाइन सामग्री के लिए उपयोग कर सकते हैं (जैसा कि ऊपर दिखाया गया है, एक <script>...</script>टैग में - या बिना या .jsकिसी scriptटैग के भरी हुई फ़ाइल में )। जब पृष्ठ पूरी तरह से पार्स हो जाता है, तो दस्तावेज़ स्ट्रीम बंद हो जाती है, और इसे फिर से खोलना - दस्तावेज़ को पूरी तरह से एक नए के साथ बदलना। यदि आप मुख्य पार्सिंग पूर्ण होने के बाद एक वर्ष जोड़ना चाहते हैं, तो आप DOM का उपयोग करना चाहते हैं। (यह एक बदलाव नहीं है, यह हमेशा इस तरह से रहा है।) deferasyncdocument.write

— टीजे क्राउडर

44

टीजे का जवाब उत्कृष्ट है, लेकिन मैं एक ऐसे परिदृश्य में भाग गया, जहां मेरा एचटीएमएल पहले से ही प्रस्तुत किया गया था और डॉक्यूमेंट को राइट-टू-डेट कर दिया गया था।

इस परिदृश्य के लिए, आप निम्न कोड का उपयोग करके मौजूदा तत्व के लिए एक पाठ नोड संलग्न कर सकते हैं:

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

— एडम मिलेकी
स्रोत

हाँ - एक अच्छा समाधान! मैं HTML बॉडी के अंत में बॉडी टैग या आपके अन्य js से पहले स्क्रिप्ट स्निपेट को स्थानांतरित करने की सलाह देता हूं।

— क्रिश्चियन माइकल

createTextNode()HTML की व्याख्या नहीं करता है <br>कि आप HTML के साथ एक नोड कैसे बनाते हैं?

— रूबों 77

19

यदि आप वर्तमान वर्ष (उदाहरण 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.

— मार्टिन एडम्स
स्रोत

13

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

— थॉमस क्रेम्मेल
स्रोत

1

मुझे पता है कि सिर्फ <script> छोटी है (अन्य उत्तर देखें), लेकिन उसका वर्तमान अधिक है और हमेशा काम करेगा। वास्तव में, मेरे पास WP में एक उदाहरण था जहां दूसरा काम नहीं करेगा, लेकिन यह कोई समस्या नहीं थी। यकीन नहीं है कि WP इस पर एक मुद्दा क्यों फेंक देगा ... मुझे पता है कि आजकल आप इसे छोड़ सकते हैं; अंत में और स्क्रिप्ट डिफ़ॉल्ट रूप से js को वैसे भी, लेकिन फिर भी।

— मलाची

9

जेएस समाधान महान काम करता है, लेकिन मैं एक सर्वर साइड समाधान पर सलाह दूंगा। जिन साइटों की मैंने जाँच की उनमें से कुछ में पूरे पृष्ठ के खाली होने का मुद्दा था और केवल वर्ष में एक बार देखा जा रहा था।

इसका कारण दस्तावेज़ था। वास्तव में पूरे दस्तावेज़ में लिखा था।

मैंने अपने मित्र से सर्वर साइड समाधान को लागू करने के लिए कहा और यह उसके लिए काम आया। Php में सरल कोड

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

का आनंद लें!

— Arcanyx
स्रोत

1

आपका समाधान इतना आसान है, लेकिन बात यह है कि प्रश्न जावास्क्रिप्ट से संबंधित है

— Mo.

2

Haha! जब मैंने यह पोस्ट किया तो समाधान पहले से ही दिया गया था। फिर भी मैं चाहता था कि लोग यह जानें कि दूसरे तरीके भी हैं! आशा है कि यह भविष्य में मेरे जैसे किसी की मदद करेगा!

— आर्किंक्स

मैं आपसे सहमत हूं कि जब हम समान सोच के साथ कोई समाधान नहीं करते हैं तो हमें वैकल्पिक रूप से देखने की जरूरत है। नीचे वोट के बारे में सावधान रहें।

— मो।

और क्या होगा यदि सर्वर-साइड समाधान Node.js और इस प्रकार जावास्क्रिप्ट है?

— rorymorris89

2

यदि पृष्ठ खाली हो जाता है, तो इसका मतलब है कि document.writeडोम पहले लोड होने के बाद उपयोग किया गया था। समाधान document.writeसभी DOM भार के बाद उपयोग नहीं करना है , या, और भी बेहतर है, बिल्कुल भी उपयोग नहीं करना है document.write।

— user4642212 12

8

यहाँ परम सबसे कम जिम्मेदार संस्करण है जो AD और BC दोनों में काम करता है।

[ड्रम रोल ...]

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

बस। 6 बाइट्स स्वीकृत उत्तर से कम है।

यदि आपको ES5 संगत होना चाहिए, तो आप इसके लिए समझौता कर सकते हैं:

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

— क्रिस्टियान वेस्टरबेक
स्रोत

4

यदि आपका उपयोगकर्ता 1000 ईस्वी पूर्व के समय में वापस जाता है तो क्या होगा? या क्या होगा यदि कोई उपयोगकर्ता आपके एप्लिकेशन> 9999 AD का उपयोग कर रहा है? #responsibleCode # NotAnotherY2K;)

— निक स्टील

3

@NickSteele उम्मीद है कि हम उस बिंदु पर शुद्ध जावास्क्रिप्ट नहीं लिख रहे हैं।

— माइकल मैकक्वाडे

1

यह सबसे अच्छा समाधान है जो मैं सोच सकता हूं कि शुद्ध जावास्क्रिप्ट के साथ काम करेगा। आप तत्व को स्टाइल करने में भी सक्षम होंगे क्योंकि इसे सीएसएस में लक्षित किया जा सकता है। बस वर्ष के स्थान पर जोड़ें और यह स्वचालित रूप से अपडेट किया जाएगा।

//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

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

स्निपेट का विस्तार करें

— जोनाथन अक्वेते ओकेने
स्रोत

1

React.js के लिए, पाद में मेरे लिए निम्नलिखित कार्य किया गया है ...

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

— क्रिश स्टर्न
स्रोत

0

क्रोम ऑडिट के अनुसार

धीमे कनेक्शन पर उपयोगकर्ताओं के लिए, बाहरी स्क्रिप्ट्स को गतिशील रूप से इंजेक्शन के माध्यम document.write()से सेकंड के दसियों पेज लोड में देरी हो सकती है।

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

इसलिए त्रुटियों के बिना समाधान है:

(new Date).getFullYear();

— करोल
स्रोत