es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

¿Cómo usar un archivo Javascript para refrescar/recargar un div desde un archivo HTML?

Estoy usando Node JS y tengo un archivo JS que abre una conexión con una API, trabaja con los datos recibidos y luego guarda los datos cambiados en un archivo JSON. Luego tengo un archivo HTML que toma los datos del archivo JSON y los coloca en una tabla. Al final abro el archivo HTML en mi navegador para ver la tabla visualizada y sus datos.

Lo que me gustaría que suceda es que la tabla (o más específicamente un DIV con una ID dentro de la tabla) del archivo HTML se actualice automáticamente cuando los datos JSON se actualizan desde el archivo JS. Algo así como una “tabla/sitio web en vivo” que pueda ver cambiando con el tiempo sin necesidad de presionar F5.

En lugar de simplemente abrir el HTML localmente, lo he intentado usando el archivo JS y creando una conexión con el archivo de esta manera:

const http = require(‘http’);
const path = require(‘path’);

const browser = http.createServer(function (request, response) {

var filePath = '.' + request.url;
if (filePath == './') {
    filePath = './Table.html';
}

var extname = String(path.extname(filePath)).toLowerCase();
var mimeTypes = {
    '.html': 'text/html',
    '.css': 'text/css',
    '.png': 'image/png',
    '.js': 'text/javascript',
    '.json': 'application/json'
};

var contentType = mimeTypes[extname] || 'application/octet-stream';

fs.readFile(filePath, function(error, content) {
    response.writeHead(200, { 'Content-Type': contentType });
    response.end(content, 'utf-8');
});

}).listen(3000);

Esto crea una conexión de trabajo y puedo verlo en el navegador, pero lamentablemente no se actualiza como deseo. Pensé en algún tipo de función que se llame justo después de que se haya guardado el archivo JSON y le diga al DIV que se recargue a sí mismo.
También leí sobre algo como window.onload, location.load() o getElementById(), pero no puedo entender la manera correcta.

¿Qué puedo hacer?
Gracias.

Tags:  , ,

Answer

  1. Avatar for davy.ai

    Puedes usar JavaScript para recargar el div cuando se actualiza el archivo JSON. Puedes usar window.onload para llamar a una función cuando se carga la página, y después utilizar setInterval para llamar a una función cada pocos segundos para comprobar si se ha actualizado el archivo JSON. Si es así, puedes usar getElementById para obtener el div y luego usar location.reload() para recargar el div.

Comments are closed.