如何将文本文件的内容加载到javascript变量中？

我在我的网络应用程序http://localhost/foo.txt的根目录中有一个文本文件,我想将它加载到javascript中的变量..在groovy中我会这样做:

def fileContents = 'http://localhost/foo.txt'.toURL().text;
println fileContents;

如何在javascript中获得类似的结果？

XMLHttpRequest,即AJAX,没有XML.

您执行此操作的确切方式取决于您正在使用的JavaScript框架,但如果我们忽略互操作性问题,您的代码将类似于:

var client = new XMLHttpRequest();
client.open('GET', '/foo.txt');
client.onreadystatechange = function() {
  alert(client.responseText);
}
client.send();

但是,正常情况下,XMLHttpRequest并非在所有平台上都可用,因此一些软件已经完成.再一次,最好的办法是使用像jQuery这样的AJAX框架.

一个额外的考虑因素:只有当foo.txt位于同一个域时,这才会起作用.如果它位于不同的域中,则同源安全策略将阻止您读取结果.

这是我在jquery中的表现:

jQuery.get('http://localhost/foo.txt', function(data) {
    alert(data);
});

使用Fetch:

fetch('http://localhost/foo.txt')
  .then(response => response.text())
  .then((data) => {
    console.log(data)
  })

https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API

如果您只想从文本文件中获取常量字符串,则可以将其包含为JavaScript:

// This becomes the content of your foo.txt file
let text = `
My test text goes here!
`;

    client.onreadystatechange = function() {

 function(data) {

var xhr=new XMLHttpRequest();
xhr.open("GET","https://12Me21.github.io/test.txt");
xhr.onload=function(){
    console.log(xhr.responseText);
}
xhr.send();

fetch("https://12Me21.github.io/test.txt")
.then( response => response.text() )
.then( text => console.log(text) )