Cum se creează și se utilizează fișiere JavaScript externe

Plasarea JavaScript direct în fișierul care conține HTML pentru o pagină web este ideală pentru scripturile scurte utilizate în timpul învățării JavaScript. Când începi să creezi scripturi care să ofere o funcționalitate semnificativă pentru pagina ta web, cu toate acestea, cantitatea de JavaScript poate deveni destul de mare, inclusiv aceste scripturi mari direct în pagina web prezintă două probleme:

  • Poate afecta clasarea paginii dvs. cu diferitele motoare de căutare dacă JavaScript ocupă majoritatea conținutului paginii. Aceasta scade frecvența de utilizare a cuvintelor cheie și a expresiilor care identifică despre ce conținut este vorba.
  • Îngreunează reutilizarea aceleiași funcții JavaScript în mai multe pagini de pe site-ul dvs. web. De fiecare dată când doriți să o utilizați pe o altă pagină, va trebui să o copiați și să o introduceți în fiecare pagină suplimentară, plus orice modificare necesită noua locație. 

Este mult mai bine dacă facem JavaScript independent de pagina web care o folosește.

Selectarea codului JavaScript care urmează să fie mutat

Din fericire, dezvoltatorii de HTML și JavaScript au oferit o soluție la această problemă. Putem muta JavaScript-urile noastre de pe pagina web și totuși să-l funcționăm exact la fel.

Primul lucru pe care trebuie să-l facem pentru a face un JavaScript extern paginii care îl folosește este să selectăm codul JavaScript propriu-zis (fără etichetele de script HTML înconjurătoare) și să-l copiem într-un fișier separat.

De exemplu, dacă următorul script se află pe pagina noastră, am selecta și copia în negru:


var hello = 'Hello World';
document.write (alo);

Exista o practică de plasare a JavaScript într-un document HTML în interiorul etichetelor de comentarii pentru a împiedica browserele mai vechi să afișeze codul; cu toate acestea, noile standarde HTML spun că browserele ar trebui să trateze automat codul în interiorul etichetelor de comentarii HTML ca comentarii, iar acest lucru duce la browsere ignorând Javascriptul dvs.. 

Dacă ați moștenit pagini HTML de la altcineva cu JavaScript în interiorul etichetelor de comentarii, atunci nu trebuie să includeți etichetele în codul JavaScript pe care îl selectați și îl copiați.

De exemplu, veți copia doar codul gras, lăsând marcajele de comentarii HTML din eșantionul de cod de mai jos:

Salvarea codului JavaScript ca fișier

După ce ați selectat codul JavaScript pe care doriți să-l mutați, lipiți-l într-un fișier nou. Dați fișierului un nume care sugerează ce face scriptul sau identifică pagina din care face parte scriptul.

Dă fișierului a .js sufix, astfel încât să știți că fișierul conține JavaScript. De exemplu, am putea folosi hello.js ca nume de fișier pentru salvarea JavaScript din exemplul de mai sus.

Legătură cu scriptul extern

Acum, când avem copiat JavaScript și salvat într-un fișier separat, tot ce trebuie să facem este să trimitem fișierul script extern pe documentul paginii noastre HTML.

În primul rând, ștergeți totul între etichetele scriptului: