Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> JavaScript

JavaScript से करंट ईयर को ऑटोमैटिकली कैसे अपडेट करें

अपने फुटर में करंट ईयर को ऑटोमैटिकली अपडेट करना सबसे आसान कामों में से एक है। दुर्भाग्य से, कई वेबसाइट मालिक नहीं जानते कि वर्तमान वर्ष प्रदर्शित करना महत्वपूर्ण है, कॉपीराइट कारणों से और अपने उपयोगकर्ताओं को यह बताने के लिए कि उनकी वेबसाइट अप-टू-डेट है।

अधिकांश पुरानी वेबसाइट्स पर, और यहां तक कि कुछ आधुनिक साइट्स पर भी, फुटर में HTML इस तरह दिखता है:

<span>© 2018 Company Name</span>
  • कॉपीराइट दावा © सिंबल का उपयोग करके।
  • वर्तमान वर्ष।
  • कंपनी का नाम।

इस स्टैटिक टाइमस्टैम्प दृष्टिकोण का उपयोग करके, वेबसाइट मालिक को हर साल प्रदर्शित वर्ष को मैन्युअल रूप से संपादित करना पड़ता है। यह अव्यावहारिक है।

सभी वेबसाइट्स में फुटर जानकारी संपादित करने के लिए आसान पहुंच के साथ यूजर-फ्रेंडली UI डैशबोर्ड नहीं होता। इसलिए वेबसाइट मालिक को या तो अपनी HTML फ़ाइलों को स्वयं संपादित करना पड़ता है या किसी को ऐसा करने के लिए नियुक्त करना पड़ता है।

यह समय और संसाधनों की बर्बादी है।

पुराने टाइमस्टैम्प आपके ब्रांड को नुकसान पहुंचा सकते हैं

दुर्भाग्य से, वर्तमान वर्ष प्रदर्शित न करने से आपकी वेबसाइट पुरानी लगती है — भले ही यह न हो। यदि आप आज किसी वेबसाइट पर जाते हैं, लेकिन वेबसाइट का वर्तमान वर्ष 2015 कहता है, तो आप क्या सोचते हैं?

बिल्कुल। यह आपको आश्चर्यचकित करता है कि क्या वेबसाइट अभी भी सक्रिय है।

आज के बाद, आपको अपनी साइट या अपने किसी भी क्लाइंट की वेबसाइट पर इस समस्या के बारे में चिंता करने की आवश्यकता नहीं होगी।

JavaScript के getFullYear() मेथड से वर्तमान वर्ष प्रदर्शित करें

ऊपर HTML में देखे गए स्टैटिक टाइमस्टैम्प के बजाय, आइए इसे डायनामिक बनाएं अपने फुटर में नेटिव JavaScript डेट मेथड, getFullYear(): जोड़कर।

सबसे पहले, अपने ब्राउज़र कंसोल (या कंसोल के साथ किसी भी टेक्स्ट एडिटर) में निम्न कोड जोड़ें ताकि हम इसका परीक्षण कर सकें:

document.write(new Date().getFullYear());

एंटर दबाएं, और आपको अपने ब्राउज़र विंडो के ऊपरी बाएं कोने में वर्तमान तारीख दिखाई देगी।

JavaScript से करंट ईयर को ऑटोमैटिकली कैसे अपडेट करें

आप इस CodePen उदाहरण में कोड को कार्य करते हुए देख सकते हैं। कंसोल विंडो को देखें।

अब जब हम जानते हैं कि यह काम करता है, तो आइए ऊपर से getFullYear() कोड लें और इसे पहले के अपने फुटर HTML के अंदर लपेटें:

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

परिणाम:

JavaScript से करंट ईयर को ऑटोमैटिकली कैसे अपडेट करें

बधाई हो, अब आपको अपने वर्ष टाइमस्टैम्प को अप-टू-डेट रखने की चिंता करने की आवश्यकता नहीं है, JavaScript यहां से संभाल लेता है।

मूल कॉपीराइट वर्ष और वर्तमान वर्ष दोनों दिखाएं

कभी-कभी आप वर्तमान वर्ष और वह वर्ष दोनों प्रदर्शित करना चाहते हैं जब आपने अपनी कंपनी पंजीकृत की थी। यह आपके कॉपीराइट दावों के वर्ष को हाइलाइट करने के लिए हो सकता है। कोई समस्या नहीं। यदि आप अपना प्रारंभ वर्ष 2016 चाहते हैं, तो बस ऊपर दिए गए कोड में 2016- जोड़ें, ताकि यह इस तरह दिखे:

<span> &copy; 2016-<script>document.write(new Date().getFullYear());</script> Company Name </span>
  1. JavaScript से ऑटोकंप्लीट कैसे बनाएं? JavaScript से ऑटोकंप्लीट कैसे बनाएं?

    फॉर्म में ऑटोकंप्लीशन (स्वचालित पूर्ण) बनाने का कोड नीचे दिया गया है। उदाहरण <!DOCTYPE html> <html> <head> <meta name=viewport content=width=device-width, initial-scale=1.0 /> <style> * { box-sizing: border-box; } body { margin: 10px; padding: 0px; fo

  1. JavaScript से टेक्स्ट टॉगल करें JavaScript से टेक्स्ट टॉगल करें

    JavaScript का उपयोग करके किसी एलिमेंट का टेक्स्ट कंटेंट दो स्थितियों के बीच टॉगल करना एक सामान्य UI पैटर्न है (जैसे अधिक दिखाएं/कम दिखाएं, चालू/बंद)। उदाहरण <!DOCTYPE html> <html> <head> <meta name=viewport content=width=device-width, initial-scale=1 /> <style> bo

  1. JavaScript से वर्तमान एलिमेंट में एक्टिव क्लास कैसे जोड़ें? JavaScript से वर्तमान एलिमेंट में एक्टिव क्लास कैसे जोड़ें?

    JavaScript से वर्तमान एलिमेंट में एक्टिव क्लास जोड़ने के लिए, निम्न कोड का उपयोग करें: उदाहरण <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1" /> <style>    .btn {       border