I want to read a .txt file an URL location, lets say from and process its content on my page.
Can you point me out some tutorials or some basic code on how to do this in javascript?
I have a basic HTML code where I have some tables and I want to populate them with text from a .txt from a given URL location, but I do not know how to read the data from that location.
<html> <head> <title>Pseudoganglia Interface</title> <!-- CSS goes in the document HEAD or added to your external stylesheet --> <style type="text/css"> table.gridtable { font-family: verdana,arial,sans-serif; font-size:11px; color:#333333; border-width: 1px; border-color: #666666; border-collapse: collapse; } table.gridtable th { border-width: 1px; padding: 8px; border-style: solid; border-color: #666666; background-color: #dedede; } table.gridtable td { border-width: 1px; padding: 8px; border-style: solid; border-color: #666666; background-color: #ffffff; } </style> <!-- Table goes in the document BODY --> <script> function getText() { // read text from URL location } function populateTables() { var tableHP = document.getElementById("tHP"); // Create an empty <tr> element and add it to the 1st position of the table: var row = tableHP.insertRow(tableHP.rows.length); // Insert new cells (<td> elements) at the 1st and 2nd position of the "new" <tr> element: var cell1 = row.insertCell(0); var cell2 = row.insertCell(1); // Add some text to the new cells: cell1.innerHTML = "NEW CELL1"; cell2.innerHTML = "NEW CELL2"; } </script> </head> <body onload="populateTables()"> <table> <tr> <th colspan=2>HP</th> </tr> <tr> <td># SN</td> <td>% of used RAM</td> </tr> </table> <br> <table> <tr> <th colspan=2>IBM</th> </tr> <tr> <td># CN</td> <td>% of used RAM</td> </tr> </table> </body> </html> 2 Answers
this code may help you:
function getText(){ // read text from URL location var request = new XMLHttpRequest(); request.open('GET', ' true); request.send(null); request.onreadystatechange = function () { if (request.readyState === 4 && request.status === 200) { var type = request.getResponseHeader('Content-Type'); if (type.indexOf("text") !== 1) { return request.responseText; } } } } function populateTables(){ var outer_text = getText(); outer_text = outer_text.split('\n'); // you can adjust the manner of parsing the received file (regexp) var tableHP = document.getElementById("tHP"); // Create an empty <tr> element and add it to the 1st position of the table: var row = tableHP.insertRow(tableHP.rows.length); // Insert new cells (<td> elements) at the 1st and 2nd position of the "new" <tr> element: var cell1 = row.insertCell(0); var cell2 = row.insertCell(1); // Add some text to the new cells: cell1.innerHTML = outer_text[0]; cell2.innerHTML = outer_text[1]; }from codegrepper using fetch (unsupported on IE).
const url = "" fetch(url) .then( r => r.text() ) .then( t => //process your text! ) 
