Heim > Web-Frontend > js-Tutorial > Wie kann ich eine JavaScript-Datei in eine andere einbinden?

Wie kann ich eine JavaScript-Datei in eine andere einbinden?

DDD
Freigeben: 2024-12-21 02:28:14
Original
288 Leute haben es durchsucht

How Can I Include One JavaScript File in Another?

Wie füge ich eine JavaScript-Datei in eine andere ein?

Das Einfügen einer JavaScript-Datei in eine andere ist nicht so einfach wie die Verwendung von @import in CSS . Vor ES6 wurden verschiedene Ansätze verwendet, um dieses Problem anzugehen.

ES6-Module

Seit 2015 (ES6) führte JavaScript ES6-Module ein, um Module in Node.js zu importieren. Auch die meisten modernen Browser unterstützen diesen Standard. ES6-Module verwenden die folgende Syntax:

export function hello() {
  return "Hello";
}
Nach dem Login kopieren
import { hello } from './module.js';
let val = hello(); // val is "Hello";
Nach dem Login kopieren

Node.js erfordert

Node.js verwendet den älteren CJS-Modulstil, der auf dem basiert module.exports/require system:

// mymodule.js
module.exports = {
   hello: function() {
      return "Hello";
   }
}
Nach dem Login kopieren
// server.js
const myModule = require('./mymodule');
let val = myModule.hello(); // val is "Hello"   
Nach dem Login kopieren

Andere Browser werden geladen Methoden

Neben ES6-Modulen bieten Browser auch verschiedene andere Möglichkeiten zum Laden externer JavaScript-Inhalte:

  • AJAX-Laden:Verwenden Sie einen AJAX-Aufruf um ein zusätzliches Skript zu laden und es dann mit eval auszuführen.
  • Fetch Loading: Laden Sie Skripte mithilfe eines Abrufaufrufs und versprechen Sie, die Ausführungsreihenfolge zu steuern.
  • jQuery-Laden: Verwenden Sie die jQuery-Bibliothek, um Skripte mit einer einzigen Codezeile zu laden.
  • Dynamisches Laden von Skripten: Fügen Sie ein Skript-Tag mit der Skript-URL in den HTML-Code ein. Dadurch kann der Browser den Code auswerten.

Skriptausführung erkennen

Beim Remote-Laden von Code führen moderne Browser Skripte asynchron aus, sodass der Code dies möglicherweise nicht tut sofort nach dem Laden verfügbar. Um zu erkennen, wann das Skript ausgeführt wurde, können Sie Folgendes verwenden:

  • Ereignishandler: Binden Sie die Ereignisse onload oder onreadystatechange des Skript-Tags an eine Rückruffunktion.
  • Quellcode-Zusammenführung/Vorverarbeitung: Verwenden Sie zum Kombinieren Build-/Transpilierungstools wie Parcel, Webpack oder Babel und verarbeiten Sie JavaScript-Dateien, bevor sie in den Browser geladen werden.

Das obige ist der detaillierte Inhalt vonWie kann ich eine JavaScript-Datei in eine andere einbinden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage