@Sandman0102

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

Есть Vue компонент, где есть свой html и js.
Также есть файл sample.html, в котором много контента. Нужно при клике на кнопку в компоненте подгрузить внешний html файл и получить весь его body.
Можно ли как-то это сделать? Пробовал по rel="import', не получается
  • Вопрос задан
  • 69 просмотров
Пригласить эксперта
Ответы на вопрос 2
mizutsune
@mizutsune
Simplicity is the ultimate sophistication.
Как вариант можно использовать Fetch API.

Простой пример на обычном JS:

const button = document.querySelector(".button");
const container = document.querySelector(".container");

button.addEventListener("click", async () => {
   const response = await fetch("./path/sample.html");
   const result = await response.text();
   const parser = new DOMParser();
   const DOM = parser.parseFromString(result, "text/html");
   const targetContent = DOM.querySelector("body").innerHTML;

   container.insertAdjacentHTML("afterbegin", targetContent);
});


Думаю большого труда не составит переделать под свои нужды.
Ответ написан
Комментировать
@paxa-1331
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы