Вводить код html внешнего файла посредством javascript

Я пробую выполнять контент файла html (fichero2.html) что находится в маршруте, отличном от маршрута файла, с которым я работаю (fichero1.html). Чтобы быть более специфическим давайте предполагать, что fichero1 у него есть следующий код:

<!DOCTYPE html>
<html>
    <body>
        <p id="demo"></p>
        <div id="contenedor">
            <!--El contenido del fichero 2 se debe ubicar aquí-->
        </div>

        <script>
            document.getElementById("demo").innerHTML= "Esto es un texto de prueba";
        </script>
    </body>
</html> 

Желание, что внутри этикетки <div> с id="contenedor" была помещена таблица, которая у меня есть в fichero2, контент которого:

      <table>
        <tr>
          <th>Empresa</th>
          <th>Contacto</th>
          <th>País</th>
       </tr>
       <tr>
          <td>Claudio Bosoletti</td>
          <td>claudio@gmail.com</td>
          <td>Argentina</td>
       </tr>
       <tr>
          <td>Edgardo Fernandez</td>
          <td>edgardo@gmail.com</td>
          <td>España</td>
       </tr>
       <tr>
          <td>Lucia Guillamondegui</td>
          <td>lucia@gmail.com</td>
          <td>Uruguay</td>
      </tr>
    </table>

Которого способ могут "вводить" таблицу внутри контейнера <div> посредством javascript? Этот код, который я подтверждаю примерами, - упрощение проекта, в котором я работаю, но для более краткого давайте предполагать, что fichero1 у него есть следующий маршрут: proyecto/carpeta1/fichero1.html и fichero2 у него есть маршрут: proyecto/carpeta2/fichero2.html

Большое спасибо.

0
задан 06.11.2019, 23:14
1 ответ

Ты можешь делать это с fetch, например:

fetch("fichero2.html")
  .then(response => {
    return response.text()
  })
  .then(data => {
    document.getElementById("contenedor").innerHTML = data;
  });

AquГ - принимает, что fichero2.html estГЎ в той же папке, что и настоящий файл. Того, чтобы быть в другой папке ты должен помещать правильный маршрут.

1
ответ дан 01.12.2019, 12:28