Come includere un file JavaScript in un altro file JavaScript

Durante lo sviluppo di siti Web, lo sviluppatore crea più di un file JavaScript per diverse funzionalità che aiutano a migliorare le prestazioni o l'applicazione complessive di un sito Web. Inoltre, può essere organizzato e gestito più facilmente. Includendo un file JavaScript in un altro file, il codice all'interno di quel file può essere riutilizzato in più punti. Ad esempio, a volte, i programmatori devono chiamare qualsiasi funzione da un altro file o accedere ad alcune variabili, il che può aiutare a prevenire i conflitti di denominazione variabile.

Questo articolo dimostrerà i metodi per includere/aggiungere un file JS in un altro file JS.

Come includere un file JavaScript in un altro file JavaScript?

Per includere/aggiungere un file JavaScript in un altro file JavaScript, utilizzare i seguenti modi:

• Usando ""Tag
• Usando "importare" Dichiarazione

Metodo 1: includere un file JavaScript in un altro file JavaScript usando il tag ""

Prima dei moduli ES6, i file JavaScript sono stati aggiunti in altri file JavaScript creando un "sceneggiatura"Elemento nel file JavaScript e usando il"src"Attributo per aggiungere il percorso/posizione del file.

Esempio

In un file HTML, crea un paragrafo usando "

"Tag assegnando un ID"testo"Per stampare il testo sulla pagina da JavaScript:

Crea un file javascript "Jsfile.js"Verrà aggiunto al file javascript principale. In questo file, scrivere un codice per stampare il testo sulla pagina Web utilizzando "Innerhtml" proprietà:

documento.getElementById ("Testo").InnerHtml = 'Ciao I'm Jsfile.js Aggiunto nel file JavaScript principale utilizzando sceneggiatura etichetta';

Nel ""Tag nel file HTML o nel file javascript principale, crea prima una variabile"sceneggiatura":

var script = documento.createElement ('script');

Ora aggiungi il percorso del file usando "src"Attributo/proprietà e poi aggiungilo da bambino a"Testa"Tag:

sceneggiatura.src = "./Jsfile.js ";
documento.Testa.appendChild (script);

Si può vedere che il "Jsfile.js"Viene aggiunto nel file JavaScript principale in quanto stampa il testo sulla pagina Web:

Metodo 2: includere un file JavaScript in un altro file JavaScript utilizzando l'istruzione "Importa"

Nei moduli ES6, viene introdotta l'istruzione Importa/Export per aggiungere il file in un altro file JavaScript. Questo è un metodo moderno supportato dalla maggior parte dei browser moderni. Ti consente di importare un file JavaScript come modulo, che può quindi essere utilizzato nel file di importazione.

Esempio

Importare il "Jsfile.js"Nel file javascript principale o nel"" Tag in un file HTML usando "importare" parola chiave:

Produzione

A volte, i programmatori devono importare solo una funzione anziché un file completo, per questo, controlla la nostra altra "funzione di esportazione in javascript" post dedicato.

Nota: Per includere un file in un altro file nel nodo.js, il "richiedere()" viene utilizzato il metodo. Consente di importare un file JavaScript come modulo, che può quindi essere utilizzato nel file di importazione come segue:

const module = requisite ('./Jsfile.js ');

Si tratta di includere il file javascript in un altro file.

Conclusione

Per includere un file JavaScript in un altro file JavaScript, usa il ""Tag creando un nuovo elemento" script "in JavaScript usando"createelement"Attributo o"importare" dichiarazione. I browser moderni supportano l'istruzione "importazione", mentre il tag "script" è un vecchio metodo per includere un file javascript in un altro file. Questo articolo ha dimostrato i metodi per includere/aggiungere un file JS in un altro file.