У меня есть текстовый файл в корне моего веб-приложения 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 () {
  оповещения (client.responseText);
}
client.send ();

Тем не менее, как правило, XMLHttpRequest доступен не на всех платформах, поэтому некоторая путаница уже сделана. Еще раз, вам лучше всего использовать AJAX-фреймворк, такой как jQuery.

Еще одно соображение: это будет работать только до тех пор, пока foo.txt находится в одном домене. Если он находится в другом домене, политики безопасности того же источника не позволят вам прочитать результат.

вот как я это сделал в jquery:

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

Обновление 2019: использование 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!
`;

<script src="foo.txt"></script>
<script>
  console.log(text);
</script>

Загруженная из файла строка становится доступной для JavaScript после загрузки. Символ `(backtick) начинается и заканчивается литералом шаблона , допуская символы" и "в вашем текстовом блоке.

Этот подход хорошо работает, когда вы пытаетесь загрузить файл локально, поскольку Chrome не разрешит AJAX для URL-адресов со file://схемой.

Следует иметь в виду, что Javascript запускается на клиенте, а не на сервере. Вы не можете «загрузить файл» с сервера в Javascript. В результате Javascript отправляет запрос на сервер, а сервер отправляет обратно содержимое запрошенного файла. Как Javascript получает содержимое? Вот для чего предназначена функция обратного вызова. В случае с Эдвардом это

    client.onreadystatechange = function() {

и в случае Данба, это

 function(data) {

Эта функция вызывается всякий раз, когда поступают данные. Версия jQuery неявно использует Ajax, она просто упрощает кодирование, инкапсулируя этот код в библиотеке.

Обновление 2020: использование Fetch с async / await

const response = await fetch('http://localhost/foo.txt');
const data = await response.text();
console.log(data);

Обратите внимание, что awaitможно использовать только в asyncфункции. Более длинный пример может быть

async function loadFileAndPrintToConsole(url) {
  try {
    const response = await fetch(url);
    const data = await response.text();
    console.log(data);
  } catch (err) {
    console.error(err);
  }
}

loadFileAndPrintToConsole('https://threejsfundamentals.org/LICENSE');

Это должно работать почти во всех браузерах:

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

Кроме того, есть новый FetchAPI:

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

При работе с jQuery вместо использования jQuery.get, например,

jQuery.get("foo.txt", undefined, function(data) {
    alert(data);
}, "html").done(function() {
    alert("second success");
}).fail(function(jqXHR, textStatus) {
    alert(textStatus);
}).always(function() {
    alert("finished");
});

Вы можете использовать, .loadчто дает вам гораздо более сжатую форму:

$("#myelement").load("foo.txt");

.loadтакже дает вам возможность загружать частичные страницы, которые могут пригодиться, см. api.jquery.com/load/ .

Если ваш ввод был структурирован как XML, вы можете использовать importXMLфункцию. (Более подробная информация здесь в Quirksmode ).

Если это не XML, и нет эквивалентной функции для импорта простого текста, тогда вы можете открыть его в скрытом фрейме и затем прочитать содержимое оттуда.