Как импортировать один файл html и использовать его в качестве предустановки в другом файле html? - PullRequest
Новая
       4

Как импортировать один файл html и использовать его в качестве предустановки в другом файле html?

0 голосов
/ 11 марта 2020

У меня есть файл шаблона, который включает в себя структуру c каждой подстраницы основного веб-сайта. Как я могу импортировать это в мои другие подстраницы? Я посмотрел на inte rnet, но ничего не могу найти. Я также пытался: 

<link rel="import" href="Preset.html">

Однако, это не работает.

Заранее спасибо.

1 Ответ

1 голос
/ 12 марта 2020

Вот шаги,

  1. В вашем файле javascript введите ajax, чтобы получить содержимое файла шаблона
  2. Теперь, как только вы получите содержимое в вашем JS файл, поместите его в какой-нибудь контейнер div внутри вашего html файла

в вашем JS файле 

fetch('path_to_html_file_here')
.then(res => res.text())
.then(txt => document.getElementById('root').innerHTML = txt)

в вашем файле HTML, 

<div id="root"></div>

Этот метод поместит все HTML, присутствующие в вашем файле шаблона, в этот div с идентификатором "root". Вы можете сделать это отдельно для верхнего, нижнего колонтитула и всех повторно используемых частей.

Попробуйте, это самый простой способ. Вы должны запустить его на локальном сервере, иначе выборка не будет работать. В противном случае вы также можете использовать любой декларативный JS подход, как в Angular или React.

Надеюсь, это поможет:)

...