0

Estoy intentando ejecutar el contenido de un fichero html (fichero2.html) que se encuentra en una ruta diferente a la del fichero con el que estoy trabajando (fichero1.html). Para ser más específico supongamos que el fichero1 tiene el siguiente código:

<!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> 

Deseo que dentro de la etiqueta <div> con el id="contenedor" se ubique una tabla que tengo en el fichero2, cuyo contenido es:

      <table>
        <tr>
          <th>Empresa</th>
          <th>Contacto</th>
          <th>País</th>
       </tr>
       <tr>
          <td>Claudio Bosoletti</td>
          <td>[email protected]</td>
          <td>Argentina</td>
       </tr>
       <tr>
          <td>Edgardo Fernandez</td>
          <td>[email protected]</td>
          <td>España</td>
       </tr>
       <tr>
          <td>Lucia Guillamondegui</td>
          <td>[email protected]</td>
          <td>Uruguay</td>
      </tr>
    </table>

De que manera se puede "insertar" la tabla dentro del contenedor <div> mediante javascript? Este código que estoy ejemplificando es una simplificación del proyecto en el que estoy trabajando, pero para más conciso supongamos que el fichero1 tiene la siguiente ruta: proyecto/carpeta1/fichero1.html y el fichero2 tiene la ruta: proyecto/carpeta2/fichero2.html

Muchas gracias.

2
  • ¿Se podría saber por qué quieres hacerlo así? fichero2 parece ser un documento HTML en sí, no una parte de otro fichero. ¿No es acaso una lógica errada? Por eso pregunto.
    – A. Cedano
    Commented el 6 nov. 2019 a las 21:08
  • Si estaba mal redactado el fichero2, copié y pegué del editor con el que estaba "jugando".
    – Lucas
    Commented el 6 nov. 2019 a las 21:17

1 respuesta 1

1

Puedes hacerlo con fetch, por ejemplo:

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

Aquí se asume que fichero2.html está en la misma carpeta que el archivo actual. De estar en otra carpeta debes poner la ruta correcta.

1
  • Muchas gracias !
    – Lucas
    Commented el 6 nov. 2019 a las 21:36

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.