Me gustaría hacer un sitio web simple sin clonar archivos HTML.
Quiero almacenar un contenido en archivos de texto separados (o html) en subdirectorios (por ejemplo, páginas/páginainicio.txt, páginas/páginasobre.txt, páginas/páginacontacto.txt). Usé la etiqueta, pero no permite reutilizar css para ese contenido incrustado.
Quiero importar esos archivos a variables y cambiar divs a través de la etiqueta innerHTML. ¿Cómo puedo importar contenido de esos archivos a variables? No quiero usar ninguna API complicada ni toneladas de código.
¿Existe un método simple disponible para cargar el contenido de los archivos en las variables usando SOLAMENTE JS (sin HTML o métodos como div invisible con contenido)?
Use un XMLHttpRequest y use la devolución de llamada onload para obtener la respuesta.
<body> <div id="divv"></div> <script> var txtFile = new XMLHttpRequest(); txtFile.onload = function(e) { document.getElementById("divv").innerHTML = txtFile.responseText; } txtFile.open("GET", "file.txt", true); txtFile.send(null); </script> </body>EDITAR: parece que necesita acceder a los archivos locales, por lo que puede usar algo como esto
<body> <div id="divv"></div> <script> window.onload = function() { var iframe = document.createElement('iframe'); iframe.id = 'iframe'; iframe.style.display = 'none'; document.body.appendChild(iframe); iframe.src = 'file.txt'; iframe.onload = function(){ var text = document.getElementById('iframe').contentDocument.body.firstChild.innerHTML; document.getElementById('divv').innerHTML = text; }; } </script> </body>