To get the text from bar.txt
you need to make a GET
call using either XMLHttpRequest
or fetch
, whichever you prefer. Then you will need to set that text as the innerHTML
property of the element you're interested in.
Note you will not be able to perform a GET
call on your local machine without first spinning up a webserver.
foo.html
:<!DOCTYPE html>
<html>
<head>
<title>Read from .txt</title>
</head>
<body>
<p>Below is the content of the text file:</p>
<p id="foo"></p>
<script>
fetch("bar.txt").then((response)=>{
return response.text();
}).then((text)=>{
document.getElementById('foo').innerHTML = text;
});
</script>
</body>
</html>
bar.txt
:What I want for Christmas:
<ul>
<li>Candy</li>
<li>Toys</li>
<li>My two front teeth</li>
</ul>