Comment inclure un fichier JavaScript dans un autre fichier javascript

Lors du développement de sites Web, le développeur crée plus d'un fichier JavaScript pour différentes fonctionnalités qui contribuent à améliorer les performances ou l'application globales d'un site Web. De plus, il peut être organisé et géré plus facilement. En incluant un fichier javascript dans un autre fichier, le code dans ce fichier peut être réutilisé à plusieurs endroits. Par exemple, parfois, les programmeurs doivent appeler n'importe quelle fonction à partir d'un autre fichier ou accéder à certaines variables, ce qui peut aider à prévenir les conflits de dénomination variables.

Cet article démontrera les méthodes pour inclure / ajouter un fichier JS dans un autre fichier JS.

Comment inclure un fichier JavaScript dans un autre fichier javascript?

Pour inclure / ajouter un fichier JavaScript dans un autre fichier JavaScript, utilisez les moyens suivants:

• En utilisant "" étiqueter
• En utilisant "importer" Déclaration

Méthode 1: Incluez un fichier JavaScript dans un autre fichier JavaScript à l'aide de la balise «»

Avant les modules ES6, les fichiers JavaScript ont été ajoutés dans d'autres fichiers JavaScript en créant un "scénario”Element dans le fichier JavaScript et en utilisant le"SRC”Attribut pour ajouter le chemin / l'emplacement du fichier.

Exemple

Dans un fichier HTML, créez un paragraphe à l'aide du «

"Tag en attribuant un ID"texte«Pour imprimer le texte sur la page de JavaScript:

Créer un fichier javascript "Jsfile.js"Cela sera ajouté au fichier JavaScript principal. Dans ce fichier, écrivez un code pour imprimer le texte sur la page Web à l'aide du «innerhtml" propriété:

document.getElementByid ("texte").innerhtml = 'bonjour je suis Jsfile.js ajouté dans le fichier JavaScript principal en utilisant scénario étiqueter';

Dans le "”TAG dans le fichier html ou dans le fichier JavaScript principal, créez d'abord une variable"scénario»:

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

Maintenant, ajoutez le chemin du fichier à l'aide du "SRC«Attribut / propriété, puis l'ajoutez en tant qu'enfant au«diriger" étiqueter:

scénario.src = "./ Jsfile.js ";
document.diriger.APPENDCHILD (script);

On peut voir que le «Jsfile.js"Est ajouté dans le fichier JavaScript principal lorsqu'il imprime le texte sur la page Web:

Méthode 2: Incluez un fichier JavaScript dans un autre fichier JavaScript à l'aide de l'instruction «Importer»

Dans les modules ES6, l'instruction Import / Export est introduite pour ajouter le fichier dans un autre fichier JavaScript. Ceci est une méthode moderne soutenue par la plupart des navigateurs modernes. Il vous permet d'importer un fichier JavaScript en tant que module, qui peut ensuite être utilisé dans le fichier d'importation.

Exemple

Importer le «Jsfile.js"Dans le fichier JavaScript principal ou le"" TAG dans un fichier html en utilisant le "importer" mot-clé:

Sortir

Parfois, les programmeurs doivent importer une seule fonction plutôt qu'un fichier complet, pour cela, consultez notre autre publication dédiée «fonction d'exportation en javascript».

Note: Pour inclure un fichier dans un autre fichier dans le nœud.JS, le «exiger()" la méthode est utilisée. Il permet d'importer un fichier JavaScript en tant que module, qui peut ensuite être utilisé dans le fichier d'importation comme suit:

const MODULE = require ('./ Jsfile.js ');

Il s'agit d'inclure le fichier JavaScript One dans un autre fichier.

Conclusion

Pour inclure un fichier JavaScript dans un autre fichier JavaScript, utilisez le "«Tag en créant un nouvel élément« script »dans JavaScript en utilisant le«création«Attribut ou«importer" déclaration. Les navigateurs modernes prennent en charge l'instruction «Importer», tandis que la balise «script» est une ancienne méthode pour inclure un fichier javascript dans un autre fichier. Cet article a démontré les méthodes pour inclure / ajouter un fichier JS dans un autre fichier.