Update HTML Object Data

Question

I am fairly new to HTML, and I am trying to make a HTML page that constantly reads a text file, so that when the contents of the text file are changed, the HTML page will also change to reflect it. My current code is as follows;

<!DOCTYPE html>
<html>
<title>File Contents</title>
<h1>File contents of input.txt<br>Below are the contents of the file input.txt, in the same directory as this file</h1>
<div><object data="Input.txt"></object></div>
</html>

However, this script only loads the text file once, and any subsequent modifications will not be shown.

Is there any way to do this with just HTML and Javascript?

Petr Hejda · Accepted Answer · 2020-05-03 00:41:36Z

1

This script will reload the <object> every 10 seconds (10000 ms).

<!DOCTYPE html>
<html>
<title>File Contents</title>
<h1>File contents of input.txt<br>Below are the contents of the file input.txt, in the same directory as this file</h1>
<div><object data="Input.txt"></object></div>
<script type="text/javascript">
setInterval(() => {
    let obj = document.getElementsByTagName('object')[0];
    obj.setAttribute('data', obj.getAttribute('data'));
}, 10000);
</script>
</html>

answered May 3, 2020 at 0:41

Petr Hejda

43.8k8 gold badges79 silver badges106 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Update HTML Object Data

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related