inkluder HTML

sfanett · 15. oktober 2020

Hei jeg lurte på hvordan kode man skal bruke for inkludere eks i HTML side ikke i PHP

sånn er det med PHP: <?php include("templates/theme/meny_include/top_left.html"); ?>

kjetilkl · 15. oktober 2020

Du kan ikke gjøre det direkte i html, men må bruke et script - eventuelt et rammeverk eller en servcerkonfig som støtter includes.

f.eks https://www.w3schools.com/howto/howto_html_include.asp

sfanett · 15. oktober 2020

Tusen takk så mye

Dan-Levi · 16. oktober 2020

Hei, dette kan du gjøre uten PHP, men ikke i ren HTML.

Her er en metode du kan bruke for å inkludere HTML uten server side kode, med JavaScript.

Filstruktur:

index.html
1.html
2.html
3.html

index.html:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <ul>
    <li><a href="#" class="content-link" data-href="1.html">1</a></li>
    <li><a href="#" class="content-link" data-href="2.html">2</a></li>
    <li><a href="#" class="content-link" data-href="3.html">3</a></li>
  </ul>
  <div id="content"></div>


  <script>

    const contentLink = document.querySelectorAll(".content-link")
    const contentElem = document.getElementById("content")


    contentLink.forEach(link => {
      link.addEventListener("click", event => 
      {
        event.preventDefault();
        requestFile(link.dataset.href)
      })
    })


const requestFile = theFile =>
{
  const oReq = new XMLHttpRequest()
  oReq.addEventListener("load", handleRequest)
  oReq.open("GET", theFile)
  oReq.send()
}

const handleRequest = body => 
{
  contentElem.innerHTML = body.target.response
}

  </script>
</body>
</html>

Endret 16. oktober 2020 av Dan-Levi

Logg inn

inkluder HTML

Anbefalte innlegg

sfanett

Lenke til kommentar

Videoannonse

kjetilkl

Lenke til kommentar

sfanett

Lenke til kommentar

Dan-Levi

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Opprett konto

Logg inn

Hvem er aktive 0 medlemmer