Copiare script e css di un sito Web

0 Condivisioni

Hai visto un simpatico script in azione su di un sito Web e vuoi copiarlo? Se lo script in questione è Javascript client-side, l’operazione è possibile e non richiede strumenti particolari anche se ovviamente è necessario conoscere il linguaggio HTML e Javascript.

CSS e JS su web

Le soluzioni per copiare script e css di un sito Web sono comunque diverse. Puoi cominciare con il download della pagina Web, in cui sono integrati gli script, attraverso WinHTTrack (la procedura è spiegata in questo post), oppure aprire la pagina di un browser Web e scegliere il menu File/Salva con nome, o ancora puoi aprire il file .html con Notepad++.

Esiste un’ulteriore opzione se non vogliamo scaricare la pagina, possiamo leggere il suo codice HTML direttamente dal browser. Se stiamo utilizzando Chrome basta anteporre view-source: all’indirizzo della pagina (ad esempio: view-source:http://www.tiscali.it). Quando andiamo a leggere il codice HTML in cerca di Javascript, basta eseguire una ricerca (dal menu Modifica/Trova), del tag <script.

View-Source:

Il codice può essere inserito in due modi:

  • se si tratta di porzioni brevi viene solitamente inserito nel tag script: si può copiare selezionandolo e premendo CTRL+C;
  • se invece si tratta di un codice più complesso, di solito viene inserito in un file a parte.

Il file viene integrato utilizzando una versione del tag <script con un riferimento al documento in questione. Per esempio <script type=”text/javascript” src=”http://www.sitoweb.it:80/global/menutendina.js”></script> indica che viene integrato il codice javascript contenuto nel file http://www.sitoweb.it:80/global/menutendina.js. Per prelevare questo codice è sufficiente aprire il suo URL nel browser e utilizzare il solito Salva con nome. Se vogliamo far funzionare una pagina HTML sul nostro sito, dobbiamo prelevare anche tutti i suoi file di script e salvarli sul nostro server. Per esempio se il file originale si chiama menutendina.js ci basta salvarlo nella stessa cartella del file HTML e modificare la riga che lo include in <script type=”text/javascript” src=”menutendina.js”></script>. In tal modo possiamo replicare l’intera logica della pagina, incluse le eventuali azioni dei menu o altri effetti che non possono essere gestiti dal solo HTML.

Codice Javascript

Molti siti Web sofisticati utilizzano il cosiddetto Node.js. Si tratta di un sistema in cui il codice javascript viene eseguito sul server e non sul client, quindi non è possibile risalire al codice originale, ma solo alla versione HTML prodotta dal server.

Per quanto riguarda i CSS, il meccanismo è molto simile. Basta cercare nel codice HTML della pagina tutti i tag <link che contengono la parola chiave “text/css”. E’ anche possibile che il codice di stile venga inserito direttamente nella pagina HTML, all’interno del tag <style. Ma è piuttosto raro dato che i fogli di stile sono sempre molto lunghi.

Codice stylesheet

Esiste un ulteriore metodo per risalire a tutti i file CSS e Javascript collegati a una pagina: utilizzando Google Chrome basta cliccare col tasto destro sulla pagina Web di partenza e scegliere la voce di menu Altri strumenti > Strumenti Sviluppatori (in Mozilla Firefox, Strumenti > Sviluppo Web > Attiva Strumenti).

strumenti di sviluppo Chrome

Nella scheda Resources è presente un diagramma ad albero che contiene la cartella Frames, all’interno della quale si trova un’ulteriore cartella che indica il sito Web visitato. Dentro questa cartella sono raggruppate tutte le risorse della pagina: script, immagini e fogli di stile. Nella cartella Scripts possiamo vedere tutti gli script caricati dalla pagina e con un clic del tasto destro è possibile salvarli nel computer. Stessa cosa vale per gli Stylesheets, i fogli di stile CSS.

Basterà modificare i riferimenti ai file .js e .css nella pagina HTML originale ed il gioco è fatto.

Non perdere nessuna notizia, aggiungici agli amici!


 

Se volete seguire i post di www.informarea.it potete iscrivervi al suo feed RSS.

0 Condivisioni

Fabrizio Cannatelli

Fondatore di Informarea.it, è un appassionato di informatica. Ha lavorato per molti anni come Analista Programmatore presso varie aziende utilizzando diversi linguaggi di sviluppo, oggi svolge un lavoro completamente diverso ma la voglia di comunicare e di condividere con il web i suoi studi e le sue curiosità lo hanno spinto a far nascere questo blog non solo per esprimere e mostrare la passione per questo mondo, ma anche per confrontarsi con nuove esperienze di sviluppo.

Fabrizio Cannatelli

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Questo sito usa Akismet per ridurre lo spam. Scopri come i tuoi dati vengono elaborati.