[Javascript] Caricamento menu da file esterno

[mizzium]

Salve a tutti,
scusatemi ma sono all'inizio nella programmazione javascript. Non ho trovato nei post precedenti quello che cerco, forse è troppo banale. Ho creato un menu in html e vorrei salvarlo in un file esterno e caricarlo dove mi serve nelle varie pagine che ho del sito che sto sviluppando. Vorrei avere un esempio per poter procedere. Grazie

 

[Max 1]

Posta il codice del menu

 

[mizzium]

<nav class="navbar navbar-expand-lg navbar-light fixed-top  py-0 py-md-0" style="border-bottom:solid; border-color:#f39200; background-color:#f39200;margin-left:-10px;">
<a class="navbar-brand" href="index.html"><img src="img/logoSaraswatiUnicoNew.png"></a>
    <!--Versione BIANCA
    <nav class="navbar navbar-expand-lg navbar-light bg-light fixed-top  py-0 py-md-0" style="border-bottom:solid; border-color:#ffa309;margin-left:-10px;">
    <a class="navbar-brand" href="index.html"><img src="img/logoSaraswatiUnico72.png"></a-->
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="navbarSupportedContent">
    <!--a class="navbar-brand" href="#"><img src="img/Logo SaraswatiUnico.jpg" style=" background-color: #FFC"></a-->
    <ul class="navbar-nav mr-sm-2 mx-auto">
        <li class="nav-item">
        <a class="nav-link" href="index.html" style="color: #639; font-family: Novecentosanswide-Bold, Arial, Helvetica, sans-serif;" >Home</a>
      </li>
     <li class="nav-item dropdown">
        <a class="nav-link dropdown-toggle" href="Attivita.html" data-toggle="dropdown" style="color: #639; font-family: Novecentosanswide-Bold, Arial, Helvetica, sans-serif;" > Attivit&agrave; </a>
        <div class="dropdown-menu">
        <a class="dropdown-item" href="Attivita.html">Attività</a>
        <a class="dropdown-item" href="Hata.html">Hatha</a>
        <a class="dropdown-item" href="YogaInVolo.html">Yoga in Volo</a>
        <a class="dropdown-item" href="Kundalini.html">Kundalini</a>
        <a class="dropdown-item" href="etavanzata.html">Yoga età avanzata</a>
        <a class="dropdown-item" href="Giocayoga.html">GiocaYoga®</a>
        <a class="dropdown-item" href="YogaGravidanza.html">Yoga in Gravidanza</a>
        <a class="dropdown-item" href="YogaPostParto.html">Yoga Post Parto</a>
        <a class="dropdown-item" href="YogaMammaBaby.html">Yoga Mamma & Bambino</a>
        <a class="dropdown-item" href="Meditazione.html">Meditazione Vipassana</a>
        <a class="dropdown-item" href="Counseling.html">Counseling</a>
        <a class="dropdown-item" href="MassaggiAyurvedici.html">Massaggi</a>
        <a class="dropdown-item" href="Individuale.html">Yoga individuale</a>
      </div>
      </li>
      <li class="nav-item dropdown">
        <a class="nav-link dropdown-toggle" href="Insegnanti.html" data-toggle="dropdown" style="color: #639; font-family: Novecentosanswide-Bold, Arial, Helvetica, sans-serif;" > Insegnanti </a>
        <div class="dropdown-menu">
        <a class="dropdown-item" href="Insegnanti.html">Insegnanti</a>
        <a class="dropdown-item" href="InsElisaCalistri.html">Elisa Calistri</a>
        <a class="dropdown-item" href="InsAlessioVernati.html">Alessio Vernati</a>
        <a class="dropdown-item" href="InsMira.html">Mira Quaglietta</a>
        <a class="dropdown-item" href="InsMarcoMarrazza.html">Marco Marrazza</a>
        <a class="dropdown-item" href="InsKatiaSalvatori.html">Katia Salvatori</a>
        <a class="dropdown-item" href="InsMicaelaJorio.html">Micaela Jorio</a>
        <a class="dropdown-item" href="InsMaurizioPignotti.html">Maurizio Pignotti</a>
       </div>
       </li>
      <li class="nav-item">
        <a class="nav-link" href="Orari.html" style="color: #639; font-family: Novecentosanswide-Bold, Arial, Helvetica, sans-serif;"> Orari  </a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="Sede.html" style="color: #639; font-family: Novecentosanswide-Bold, Arial, Helvetica, sans-serif;"> Sede  </a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="Eventi.html" style="color: #639; font-family: Novecentosanswide-Bold, Arial, Helvetica, sans-serif;"> Eventi </a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="Contatti.html" style="color: #639; font-family: Novecentosanswide-Bold, Arial, Helvetica, sans-serif;"> Contatti </a>
      </li>
      <!--span class="navbar-text">
        tel. +39 329 2849775
      </span-->
      <!--li class="nav-item">
        <a class="nav-link disabled" href="#">Disabled</a>
      </li-->
    <ul>
    <!--form class="form-inline my-2 my-lg-0">
      <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
      <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
    </form-->
  </div>
</nav>

 

[Max 1]

@mizzium
Da regolamento del forum, come tutti noi sei tenuto ad usare il tag

quando posti del codice, oppure la funzione codice dalla barra degli strumenti

Inoltre ti prego di leggere attentamente il regolamento generale del forum e quello di sezione dove posti
Grazie
Per questa volta te lo sistemo io ma mi raccomando per il futuro

Per il tuo menu nelle pagine dove lo vuoi inserire nel punto dove deve comparire metti questo codice;

<script language="javascript" src="menu.js" type="text/javascript"></script>

Ti allego il file JS del menu!
Ovvio che nel codice siora devi mettere il percorso di dove andrai a mettere il file

 

[Max 1]

Scusani ho fatto un errore il file buono è questo

 

[mizzium]

Scusa per prima e grazie dell'aiuto, verifico subito

 

[mizzium]

Ho provato a inserire il menu ma vedo che dà questo errore

Imported resource at 'file:///D:/Yoga%20VT%20Sito/js/webmenu.js' from origin 'null' has been blocked by CORS policy: Invalid response. Origin 'null' is therefore not allowed access.

 

[Max 1]

Cime vedi a me non da errori!
Ho notato che hai cambiato il nome al file menu.js se cabi dei nomi li devi cambiare sia nel file che nel richiamo
Controlla i nomi e i percorsi.
Potrebbe anvhe essere un'altro script che va in conflitto!
Hai usato l'ultimo file che ti ho mandato?
Insomma l'errore non dipende dal codice che ti ho fornito

 

[mizzium]

Max1 , ti sto chiedendo un aiuto, non sto dicendo che il tuo codice non è buono. Anzi adesso funziona anche se mi continua a dare lo stesso errore. Strano ma ok, non ci faccio caso. Comunque grazie mille, sei stato veramente prezioso e preparato. Se dovessi modificare il menu, devo stare attento ai back slash se ho capito bene!?!?!?