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

JavaScript मॉड्यूल आयात और निर्यात करना


JavaScript का उपयोग करके मॉड्यूल आयात और निर्यात करने के लिए कोड निम्न है -

नोट - इस उदाहरण को चलाने के लिए आपको लोकलहोस्ट सर्वर चलाने की आवश्यकता होगी।

INDEX.html

उदाहरण

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <style>    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 18px;       font-weight: 500;    } </style> </head> <body> <h1>JavaScript Importing and Exporting Modules</h1> <button class="Btn">IMPORT</button> <div class="result"></div> <h3> Click on the above button to import module </h3> <script src="script.js" type="module"></script> <script src="sample.js" type="module"></script> </body> </html>

script.js

import test from './sample.js'; document.querySelector('.Btn').addEventListener('click',()=>{    test(); })

sample.js

let resultEle = document.querySelector(".result"); export default function testImport(){    resultEle.innerHTML = 'Module testImport has been imported'; }

आउटपुट

JavaScript मॉड्यूल आयात और निर्यात करना

'IMPORT' बटन पर क्लिक करने पर -

JavaScript मॉड्यूल आयात और निर्यात करना


  1. जावास्क्रिप्ट मॉड्यूल्स को डायनामिकली लोड करना जावास्क्रिप्ट मॉड्यूल्स को डायनामिकली लोड करना

    जावास्क्रिप्ट मॉड्यूल्स को डायनामिकली लोड करने का कोड निम्नलिखित है - नोट - इस उदाहरण को चलाने के लिए आपको एक लोकलहोस्ट सर्वर चलाने की आवश्यकता होगी। उदाहरण <!DOCTYPE html> <html lang=en> <head> <meta charset=UTF-8 /> <meta name=viewport content=width=device-width, init

  1. जावास्क्रिप्ट में इम्पोर्ट्स और एक्सपोर्ट्स का नाम बदलना जावास्क्रिप्ट में इम्पोर्ट्स और एक्सपोर्ट्स का नाम बदलना

    जावास्क्रिप्ट में इम्पोर्ट्स और एक्सपोर्ट्स का नाम बदलने के लिए निम्नलिखित कोड है: नोट - इस उदाहरण को चलाने के लिए आपको एक लोकलहोस्ट सर्वर चलाने की आवश्यकता है। उदाहरण <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="vi

  1. हाइपर-V 2019 में वर्चुअल मशीन एक्सपोर्ट और इम्पोर्ट करना हाइपर-V 2019 में वर्चुअल मशीन एक्सपोर्ट और इम्पोर्ट करना

    अगस्त 2019 में, हमने चार लेख लिखे जो हाइपर-V 2019 को इंस्टॉल करने, कॉन्फ़िगर करने और वर्चुअल मशीन डिप्लॉय करने की प्रक्रिया को समझाते हैं। यदि आप इन लेखों से चूक गए हैं, तो आप उन्हें नीचे दिए गए लिंक पर पढ़ सकते हैं: भाग 1: हाइपर-V 2019 सर्वर कोर कैसे इंस्टॉल करें? भाग 2: हाइपर-V 2019 कोर सर्वर - प