Spostamento di JavaScript fuori dalla pagina Web

Quando scrivi per la prima volta un nuovo JavaScript, il modo più semplice per configurarlo è quello di incorporare il codice JavaScript direttamente nella pagina Web in modo che tutto sia in un unico posto mentre lo collaudi per farlo funzionare correttamente. Allo stesso modo, se si sta inserendo uno script pre-scritto nel proprio sito Web, le istruzioni potrebbero indicare di incorporare parti o tutto lo script nella pagina Web stessa.

Questo va bene per impostare la pagina e farla funzionare correttamente in primo luogo, ma una volta che la tua pagina funziona nel modo desiderato, sarai in grado di migliorare la pagina estraendo JavaScript in un file esterno in modo che la tua pagina il contenuto nell'HTML non è così ingombro di elementi senza contenuto come JavaScript.

Se copi e usi solo script Java scritti da altre persone, le loro istruzioni su come aggiungere il loro script alla tua pagina potrebbero aver portato a una o più grandi sezioni di JavaScript effettivamente incorporate nella tua stessa pagina web e le loro istruzioni non lo dicono come puoi spostare questo codice fuori dalla tua pagina in un file separato e far funzionare ancora JavaScript. Non preoccuparti perché, indipendentemente dal codice JavaScript che stai utilizzando nella tua pagina, puoi facilmente spostare il JavaScript fuori dalla tua pagina e impostarlo come file separato (o file se hai più di un pezzo di JavaScript incorporato in la pagina). Il processo per farlo è sempre lo stesso ed è meglio illustrato con un esempio.

Diamo un'occhiata a come potrebbe apparire un pezzo di JavaScript quando incorporato nella tua pagina. Il tuo codice JavaScript effettivo sarà diverso da quello mostrato negli esempi seguenti, ma il processo è lo stesso in ogni caso.

Esempio uno

  if (top.location! = self.location) top.location = self.location;  

Esempio due

Esempio tre

  / * if (top.location! = self.location) top.location = self.location; / *]]> * /  

Il tuo JavaScript incorporato dovrebbe assomigliare a uno dei tre esempi precedenti. Ovviamente, il tuo codice JavaScript effettivo sarà diverso da quello mostrato, ma probabilmente JavaScript verrà incorporato nella pagina utilizzando uno dei tre metodi sopra indicati. In alcuni casi, il codice potrebbe utilizzare il obsoleto language = "javascript" invece di type = "text / javascript" nel qual caso potresti voler aggiornare il tuo codice con un nuovo inizio, sostituendo l'attributo language con quello di tipo uno.

Prima di poter estrarre JavaScript nel suo file, devi prima identificare il codice da estrarre. In tutti e tre gli esempi precedenti, ci sono due righe di codice JavaScript effettivo da estrarre. Il tuo script probabilmente avrà molte più righe ma può essere facilmente identificato perché occuperà lo stesso posto all'interno della tua pagina delle due righe di JavaScript che abbiamo evidenziato nei tre esempi precedenti (tutti e tre gli esempi contengono le stesse due righe di JavaScript, è solo il contenitore attorno a loro che è leggermente diverso).

1. La prima cosa che devi fare per estrarre effettivamente JavaScript in un file separato è aprire un semplice editor di testo e accedere al contenuto della tua pagina web. È quindi necessario individuare il JavaScript incorporato che sarà circondato da una delle varianti di codice mostrate negli esempi precedenti.
2. Dopo aver individuato il codice JavaScript, è necessario selezionarlo e copiarlo negli Appunti. Con l'esempio sopra, il codice da selezionare è evidenziato, non è necessario selezionare i tag di script o i commenti opzionali che possono apparire intorno al codice JavaScript.
3. Apri un'altra copia del tuo editor di testo semplice (o un'altra scheda se il tuo editor supporta l'apertura di più di un file alla volta) e oltre il contenuto JavaScript lì.
4. Seleziona un nome file descrittivo da utilizzare per il tuo nuovo file e salva il nuovo contenuto usando quel nome file. Con il codice di esempio, lo scopo dello script è quello di uscire dai frame in modo che possa essere un nome appropriato framebreak.js.
5. Quindi ora abbiamo il JavaScript in un file separato torniamo all'editor dove abbiamo il contenuto della pagina originale per apportare le modifiche lì per collegarci alla copia esterna dello script.
6. Dato che ora abbiamo lo script in un file separato, possiamo rimuovere tutto tra i tag di script nel nostro contenuto originale in modo che il
7. Il passaggio finale consiste nell'aggiungere un attributo aggiuntivo al tag dello script che identifichi dove può trovare il JavaScript esterno. Lo facciamo usando a src = "nome del file" attributo. Con il nostro script di esempio, dovremmo specificare src = "framebreak.js".
8. L'unica complicazione è se abbiamo deciso di archiviare gli script Java esterni in una cartella separata dalle pagine Web che li utilizzano. In tal caso, è necessario aggiungere il percorso dalla cartella della pagina Web alla cartella JavaScript davanti al nome del file. Ad esempio, se gli script Java vengono archiviati in a js cartella all'interno della cartella che contiene le nostre pagine Web di cui avremmo bisogno src = "js / framebreak.js"

Che aspetto ha il nostro codice dopo che abbiamo separato JavaScript in un file separato? Nel caso del nostro esempio JavaScript (supponendo che JavaScript e HTML siano nella stessa cartella) il nostro HTML nella pagina Web ora legge:

Abbiamo anche un file separato chiamato framebreak.js che contiene:

if (top.location! = self.location) top.location = self.location;

Il tuo nome file e il contenuto del file saranno molto diversi da quello perché avrai estratto tutto ciò che JavaScript è stato incorporato nella tua pagina web e hai dato al file un nome descrittivo basato su ciò che fa. Il processo effettivo di estrazione sarà lo stesso, indipendentemente da quali righe contenga.