Vai al contenuto

English Italiano
Colour Theme
 

Indice Del Forum

- - - - -

Script Javascript Su File Html Versus File Esterno .Js


  • Non puoi rispondere a questa discussione
1 reply to this topic

#1 selex

selex

    Apprendista

  • Utenti
  • PipPipPip
  • 89 Messaggi:

Inviato 16 March 2012 - 12:50 PM

Ho realizzato un Drop Down Menu con Sothink DHTML Menu.
Posso vedere il menu realizzato con il browser, ma se provo a salvare il sorgente pagina su un file html e poi lanciare il file stesso, non riesco a visualizzare il menu, questo perché mancano dei file .js che stanno nella cartella d'installazione del programma. Allora, ho salvato tutti i file necessari su una cartella: esiste la funzione 'salva file necessari', e così il menu funziona.
Ora, il problema è che nel file html che dovrebbe essere il mio index.html c'è un codice javascript lungo che vorrei 'spostare' su un file .js creato appositamente e salvato su cartella /js.

<HTML>
<head>
<title>Preview</title>
<script type="text/javascript" src="file:///C|/Programmi/SourceTec/Sothink%20DHTML%20Menu%209/Resource/js/stmenu.js"></script>
<script type="text/javascript">
<!--
window.onerror=function(m,u,l)
{
	window.status = "Java Script Error: "+m;
	return true;
}
//-->
</script>

</head>

<body bgcolor="#FFFFFF" leftmargin="5" topmargin="5">
<a href="http://www.dhtml-menu-builder.com"  style="display:none;visibility:hidden;">Drop Down Menu</a>
<script type="text/javascript">
<!--
stm_bm(["menu0129",970,"","file:///C|/Programmi/SourceTec/Sothink%20DHTML%20Menu%209/Resource/blank.gif",0,"","",0,0,0,0,1000,1,0,0,"","",0,0,1,1,"default","hand","",1,25],this);
stm_bp("p0",[0,4,0,0,6,0,580,7,100,"",-2,"",-2,90,0,0,"#7F7F7F","#000000","",3,1,1,"#000000"]);
stm_ai("p0i0",[2,"","file:///C|/Programmi/SourceTec/Sothink%20DHTML%20Menu%209/templates/Clone/Nike%20Menu/nike.gif","file:///C|/Programmi/SourceTec/Sothink%20DHTML%20Menu%209/templates/Clone/Nike%20Menu/nike.gif",41,19,0,"","_self","","","","",0,0,0,"","",0,0,0,0,1,"#CCCCCC",1,"#FFCC00",1,"","",3,3,0,0,"#FFFFFF","#FFFFFF","#000000","#000000","bold 9pt Arial","bold 9pt Arial",0,0,"","","","",0,0,0]);
stm_aix("p0i1","p0i0",[0,"","","",-1,-1,0,"","_self","","","","",580,10,0,"","",0,0,0,0,1,"#CCCCCC",1,"#FFCC00",1,"","",3,3,0,0,"#666666","#666666","#FFFFFF","#FFFFFF","8pt Arial","8pt Arial"],30,0);
stm_aix("p0i2","p0i0",[0,"Prodotti1 ","","",-1,-1,0,"#","_self","","","","",0,0,0,"file:///C|/Programmi/SourceTec/Sothink%20DHTML%20Menu%209/templates/Clone/Nike%20Menu/yellow4-d.gif","file:///C|/Programmi/SourceTec/Sothink%20DHTML%20Menu%209/templates/Clone/Nike%20Menu/yellow4-d.gif",7,7,0,1,1,"#000000",0,"#000000",1,"","",3,3,0,0,"#FFFFFF","#FFFFFF","#FFFFFF","#FFFFFF","10pt Arial","10pt Arial"]);
stm_bp("p1",[1,4,0,7,0,0,5,7,100,"progid:DXImageTransform.Microsoft.Fade(overlap=.5,enabled=0,Duration=0.48)",-2,"progid:DXImageTransform.Microsoft.Fade(overlap=.5,enabled=0,Duration=0.48)",-2,62,0,0,"#7F7F7F","#FFFFFF","",3,1,1,"#999999"]);
stm_ai("p1i0",[0,"Regioni","","",-1,-1,0,"#","_self","","","","",5,1,0,"","",0,0,0,0,1,"#000000",1,"#DBDBDB",1,"","file:///C|/Programmi/SourceTec/Sothink%20DHTML%20Menu%209/templates/Clone/Nike%20Menu/bg2.gif",3,3,0,0,"#FFFFFF","#FFFFFF","#000000","#FFFFFF","bold 9pt Arial","bold 9pt Arial",0,0,"","file:///C|/Programmi/SourceTec/Sothink%20DHTML%20Menu%209/templates/Clone/Nike%20Menu/bg1.gif","","file:///C|/Programmi/SourceTec/Sothink%20DHTML%20Menu%209/templates/Clone/Nike%20Menu/bg3.gif",6,6,20],0,20);
stm_ai("p1i1",[6,1,"#000000","",150,1,0]);
stm_aix("p1i2","p1i0",[0,"Abruzzo","","",-1,-1,0,"#","_self","","","","",0,0,0,"file:///C|/Programmi/SourceTec/Sothink%20DHTML%20Menu%209/templates/Clone/Nike%20Menu/yellow4-d.gif","file:///C|/Programmi/SourceTec/Sothink%20DHTML%20Menu%209/templates/Clone/Nike%20Menu/yellow4-d.gif",7,7,0,0,1,"#000000",1,"#DBDBDB",1,"","file:///C|/Programmi/SourceTec/Sothink%20DHTML%20Menu%209/templates/Clone/Nike%20Menu/bg2.gif",3,3,0,0,"#FFFFFF","#FFFFFF","#000000","#FFFFFF","9pt Arial","9pt Arial"],0,20);
stm_bpx("p2","p1",[1,2,-15,0,0,0,0,0]);
stm_aix("p2i0","p1i2",[0,"Chieti","","",-1,-1,0,"","_self","","","","",0,0,0,"","",0,0]);
stm_aix("p2i1","p2i0",[0,"L\'Aquila"]);
stm_aix("p2i2","p2i0",[0,"Pescara"]);
stm_aix("p2i3","p2i0",[0,"Teramo"]);
stm_ep();


SEGUE IL CODICE RELATIVO ALLE ALTRE REGIONI e lo script si chiude così:

stm_ep();
stm_cf([0,0,0,"Main_frame","Navigation_frame",1]);
stm_em();
//-->
</script>

</body>
</html>

Il mio obiettivo, per svuotare il file index.html, è quello di 'spostare' il contenuto dello script (da '<!--' a '//-->') in un file .js esterno da salvare nella cartella 'js' (i files immagine li salvo nella cartella 'img'), e il file index.html starà sulla cartella principale del sito.

Ho provato a creare questo file .index.html (ho modificato il source nel 1° script -> src=".../js/)(nel 2° script ho indicato solo la sorgente: il file Menu1.js dove ho copiato il codice e salvato con Notepad)

<HTML>
<head>
<title>Preview</title>
<script type="text/javascript" src="../js/stmenu.js"></script>
<script type="text/javascript">
<!--
window.onerror=function(m,u,l)
{
	window.status = "Java Script Error: "+m;
	return true;
}
//-->
</script>

</head>

<body bgcolor="#FFFFFF" leftmargin="5" topmargin="5">
<a href="http://www.dhtml-menu-builder.com"  style="display:none;visibility:hidden;">Drop Down Menu</a>
<script type="text/javascript"> src="../js/Menu1.js"></script>

</body>
</html>

Il file index.html non funziona (nonostante tutti i file .js e di immagini siano nelle rispettive cartelle). COME posso fare?

Post modificato da frman il 18 March 2012 - 14:14 PM
Inserimento appositi tag ([CODE]) per l'inserimento del codice


#2 frman

frman

    PenSuite Developer

  • Admin
  • 12634 Messaggi:
  • Sesso:

Inviato 18 March 2012 - 15:23 PM

Ti rispondo andando per gradi e cercando di essere molto conciso.

Problemi riscontrati nel codice
Il codice html lo stai generando manualmente o tramite qualche tool?
Il codice è scritto senza rispettare alcuni accorgimenti, quali:

1) dichiarazione del doctype ( http://it.wikipedia....Type_Definition ): il doctype indica la tipologia di documento che il browser deve andare a visualizzare, definendo le regole strutturali dello stesso.
E' utile specificare questa informazione per permettere la corretta interpretazione del codice HTML.

Se stai scrivendo manualmente le pagine web, dovresti sapere che vi sono diverse versioni di HTML (ex. HTML4.01, XHTML, HTML5,...), quindi il doctype.
Se stai scrivendo un documento xHTML 1.0, il doctype in testa alla pagina è
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Se, invece, stai scrivendo codice HTML5, il doctype da usare è:
<!DOCTYPE html>

2) I riferimenti ai file sono fatti mediante indirizzo assoluto (es. "file:///C|/Programmi/SourceTec/Sothink%20DHTML%20Menu%209/Resource/js/stmenu.js" )

Per assicurarti che il codice funzioni correttamente cambiando il percorso della cartella contenente i file web (es. sposti la cartella su un server web) ti converrebbe usare i riferimenti relativi.
Brevemente, se hai nella stessa cartella il tuo file index.html e la cartella js, il percorso relativo diventa: "js/stmenu.js".

Maggiori informazioni: http://it.wikipedia.org/wiki/Percorso

3) Consiglio, non regola: i tag del codice html dovrebbero essere scritti in minuscolo, sebbene in teoria siano case insensitive (ma diverse eccezioni portano all'adozione di questa modalità di scrittura).

In pratica i browser (Chrome, Internet Explorer, Firefox) sono molto flessibili, leggendo quasi tutti i tag in modo insensitive (maiuscole o minuscole non fanno differenza - A=a). Questo terzo punto è solo una buona prassi di programmazione.



Problema del topic
1. Codice javascript in file esterno

Visualizza messaggioselex, su 16 March 2012 - 12:50 PM, ha detto:

Ora, il problema è che nel file html che dovrebbe essere il mio index.html c'è un codice javascript lungo che vorrei 'spostare' su un file .js creato appositamente e salvato su cartella /js.

L'utilizzo di file esterni .js viene utilizzato quando vi sono delle funzioni richiamate in diversi punti ed è comodo avere un file comune da richiamare per evitare di duplicare il codice.
Se il codice, invece, è presente solo all'interno di una pagina si preferisce inglobarlo direttamente nel file .html, però nessuno ti vieta l'utilizzo di un file esterno.

Creato il file javascript (.js) lo richiami all'interno della pagina con un codice simile a questo:
<script type="text/javascript" src="esempio.js"></script>

Attenzione ai percorsi, però: se sposti il codice e i riferimenti alle altre risorse non sono stati opportunamente aggiornate, il risultato può non essere quello desiderato.


2. Percorsi

Citazione

[...]file .js esterno da salvare nella cartella 'js' (i files immagine li salvo nella cartella 'img'), e il file index.html starà sulla cartella principale del sito.

Se ho ben capito dovresti avere una situazione simile:
| js/
+-- codice.js
| img/
+--- img1.jpg
- file1
- index.html

il file index.html avrà i riferimenti:
- codice javascript: src="js/codice.js"
- immagine: src="img/img1.jpg"

se, ipoteticamente, il file js deve indirizzare l'oggetto "file1", il suo percorso sarebbe "../file1".
la sintassi "../" permette di navigare verso l'alto l'albero delle cartelle.


Credo sia un discorso di percorsi non correttamente espressi.

Tool utili
Se hai dimestichezza con il codice HTML, gli strumenti per sviluppatore di Google Chrome (visualizzabili premendo F12) o Firebug per Mozilla Firefox ( http://getfirebug.com/ ) potrebbero esserti utili.






0 utente(i) stanno leggendo questa discussione

utenti, ospiti, utenti anonimi

Coded for IP.Board 3.2 by Scott Jones of the TheDanzorLabs - Web Design and Development