Inclure une page HTML dans une autre page HTML

Olivieras
Les bases HTML/CSS

Salut à tous;

Je suis actuellement sur projet d'application desktop que je developpe avec Électron js et comme vous le savez, il fonctionne avec des pages HTML (à ce que je sache).

Maintenant pour ne pas arriver à modifier mon header et mon footer sur chacun des pages à chaque fois que j'en aurais besoin, je veux créer les pages header.html (pour le header) et footer.html (pour le footer) et les inclure sur toutes les pages de mon application.

Mon but c'est de faire les modifications une seule fois pour mon header et mon footer.

Mon souci c'est que je ne sais comment le faire. Veuillez m'aider svp.

Cordialement, Olivieras.

2 réponses

popotte

Salut :)

Alors pour inclure dans une page HTML le seul moyen c'est de passer par du JS:

document.getElementById('header/footer').innerHTML = '' // le contenu de ton header/footer

Maintenant inclure le header et le footer c'est n'est pas la meilleure façon de faire, le top serait de faire un layout, comme ça au lieux d'importer le header partout, tu l'importes dans un seul endroit, un peut comme dans ReactJS

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">>
    <title>Basic Electron App</title>
  </head>
  <body>
    <header>
        <!-- Le contenus de ton header -->
    </header>

    <!-- Le contenu de ta page qui sera généré en JS -->
    <div id="app"></div>

    <footer>
        <!-- Le contenu de ton footer -->
    </footer>

    <script>
      require('./app.js') // Ton appli, qui fera les actions et qui poussera le contenu de ta page dans <div id="app"></div> 
    </script>
  </body>
</html>
Olivieras
Auteur

Merci pour ton aide. J'essaie et je te fais un retour