Jak dołączyć plik JavaScript do innego pliku JavaScript

Podczas opracowywania stron internetowych programista tworzy więcej niż jeden plik JavaScript dla różnych funkcji, który pomaga poprawić ogólną wydajność lub aplikację witryny. Można go również zorganizować i łatwiej zarządzać. Uwzględniając plik JavaScript do innego pliku, kod w tym pliku można ponownie wykorzystać w wielu miejscach. Na przykład czasami programiści muszą wywołać dowolną funkcję z innego pliku lub uzyskać dostęp do niektórych zmiennych, co może pomóc zapobiec konfliktom nazewnictwa zmiennych.

W tym artykule pokazuje metody uwzględnienia/dodania pliku JS do innego pliku JS.

Jak dołączyć plik JavaScript do innego pliku JavaScript?

Aby dołączyć/dodać plik JavaScript do innego pliku JavaScript, użyj następujących sposobów:

• Za pomocą "”Tag
• Za pomocą "import" Oświadczenie

Metoda 1: Dołącz plik JavaScript w innym pliku JavaScript za pomocą znacznika „”

Przed modułami ES6 pliki JavaScript zostały dodane do innych plików JavaScript, tworząc „scenariusz”Element w pliku JavaScript i za pomocą„src”Atrybut, aby dodać ścieżkę/lokalizację pliku.

Przykład

W pliku HTML utwórz akapit za pomocą „

„Tag, przypisując identyfikator”tekst„Aby wydrukować tekst na stronie z JavaScript:

Utwórz plik JavaScript „Jsfile.JS”, Który zostanie dodany do głównego pliku JavaScript. W tym pliku napisz kod, aby wydrukować tekst na stronie internetowej za pomocą „InnerHtml" nieruchomość:

dokument.getElementById („tekst”).innerHtml = 'Hello I'm Jsfile.JS dodane w głównym pliku JavaScript za pomocą scenariusz etykietka';

W "”Tag w pliku HTML lub głównym pliku JavaScript, najpierw utwórz zmienną”scenariusz”:

var script = dokument.createElement („skrypt”);

Teraz dodaj ścieżkę pliku za pomocą „src”Atrybut/właściwość, a następnie dodaj ją jako dziecko do„głowa”Tag:

scenariusz.src = "./Jsfile.js ";
dokument.głowa.appendchild (skrypt);

Widać, że „Jsfile.JS”Jest dodawany w głównym pliku JavaScript, gdy drukuje tekst na stronie internetowej:

Metoda 2: Dołącz plik JavaScript w innym pliku JavaScript za pomocą instrukcji „Importuj”

W modułach ES6 wprowadzana jest instrukcja importu/eksportu, aby dodać plik do innego pliku JavaScript. To nowoczesna metoda wspierana przez większość współczesnych przeglądarek. Pozwala importować plik JavaScript jako moduł, który można następnie użyć w pliku importowania.

Przykład

Importować „Jsfile.JS”W głównym pliku JavaScript lub„" tag w pliku HTML za pomocą „import”Słowo kluczowe:

Wyjście

Czasami programiści muszą zaimportować tylko jedną funkcję, a nie kompletny plik, w tym celu sprawdź naszą dedykowaną funkcję „Eksport w JavaScript”.

Notatka: Aby dołączyć plik do innego pliku w węźle.JS, „wymagać()" Zastosowana jest metoda. Umożliwia import pliku JavaScript jako modułu, który można następnie użyć w pliku importowania w następujący sposób:

moduł const = wymaga ('./Jsfile.js ');

Chodzi o włączenie jednego pliku JavaScript do innego pliku.

Wniosek

Aby dołączyć plik JavaScript do innego pliku JavaScript, użyj „„Tag, tworząc nowy element„ skryptu ”w JavaScript za pomocą„UtwórzELEMent”Atrybut lub„import" oświadczenie. Nowoczesne przeglądarki obsługują instrukcję „importu”, podczas gdy znacznik „skryptu” jest starą metodą włączenia pliku JavaScript do innego pliku. W tym artykule pokazano metody włączenia/dodania pliku JS do innego pliku.