Maison > interface Web > js tutoriel > Comment puis-je inclure un fichier JavaScript dans un autre ?

Comment puis-je inclure un fichier JavaScript dans un autre ?

DDD
Libérer: 2024-12-21 02:28:14
original
288 Les gens l'ont consulté

How Can I Include One JavaScript File in Another?

Comment inclure un fichier JavaScript dans un autre ?

Inclure un fichier JavaScript dans un autre n'est pas aussi simple que d'utiliser @import en CSS . Avant ES6, diverses approches étaient utilisées pour résoudre ce problème.

Modules ES6

Depuis 2015 (ES6), JavaScript a introduit les modules ES6 pour importer des modules dans Node.js. La plupart des navigateurs modernes prennent également en charge cette norme. Les modules ES6 utilisent la syntaxe suivante :

export function hello() {
  return "Hello";
}
Copier après la connexion
import { hello } from './module.js';
let val = hello(); // val is "Hello";
Copier après la connexion

Node.js require

Node.js utilise l'ancien style de module CJS, basé sur le module.exports/require system :

// mymodule.js
module.exports = {
   hello: function() {
      return "Hello";
   }
}
Copier après la connexion
// server.js
const myModule = require('./mymodule');
let val = myModule.hello(); // val is "Hello"   
Copier après la connexion

Autre chargement du navigateur Méthodes

En plus des modules ES6, les navigateurs proposent également diverses autres options pour charger du contenu JavaScript externe :

  • Chargement AJAX : Utiliser un appel AJAX pour charger un script supplémentaire, puis exécutez-le à l'aide de eval.
  • Récupérer Chargement : Chargez les scripts à l'aide d'un appel fetch et promets de contrôler l'ordre d'exécution.
  • Chargement jQuery : Utilisez la bibliothèque jQuery pour charger des scripts avec une seule ligne de code.
  • Chargement dynamique du script : Ajoutez une balise de script avec l'URL du script dans le HTML. Cela permet au navigateur d'évaluer le code.

Détection de l'exécution de script

Lors du chargement de code à distance, les navigateurs modernes exécutent des scripts de manière asynchrone, de sorte que le code peut ne pas être disponible immédiatement après le chargement. Pour détecter quand le script a été exécuté, vous pouvez utiliser :

  • Gestionnaires d'événements : Liez les événements onload ou onreadystatechange de la balise de script à une fonction de rappel.
  • Fusion/prétraitement du code source : Utilisez des outils de construction/transpilation comme Parcel, Webpack ou Babel pour combiner et traitez les fichiers JavaScript avant qu'ils ne soient chargés dans le navigateur.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal