Ho un file di testo nella radice della mia app Web http: //localhost/foo.txt e vorrei caricarlo in una variabile in javascript .. in groovy vorrei fare questo:

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

Come posso ottenere un risultato simile in JavaScript?

XMLHttpRequest, ovvero AJAX, senza XML.

Il modo preciso in cui lo fai dipende dal framework JavaScript che stai utilizzando, ma se ignoriamo i problemi di interoperabilità, il tuo codice sarà simile a:

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

Normalmente, però, XMLHttpRequest non è disponibile su tutte le piattaforme, quindi alcuni lavori sono fatti. Ancora una volta, la soluzione migliore è utilizzare un framework AJAX come jQuery.

Un'ulteriore considerazione: funzionerà solo finché foo.txt è sullo stesso dominio. Se si trova su un dominio diverso, le politiche di sicurezza della stessa origine ti impediranno di leggere il risultato.

ecco come l'ho fatto in jquery:

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

Aggiornamento 2019: utilizzo di 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

Se desideri solo una stringa costante dal file di testo, puoi includerla come 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>

La stringa caricata dal file diventa accessibile a JavaScript dopo essere stata caricata. Il carattere `(backtick) inizia e termina un modello letterale , consentendo sia i caratteri" che "nel blocco di testo.

Questo approccio funziona bene quando si tenta di caricare un file localmente, poiché Chrome non consentirà AJAX sugli URL con lo file://schema.

Una cosa da tenere a mente è che Javascript funziona sul client e non sul server. Non puoi davvero "caricare un file" dal server in Javascript. Quello che succede è che Javascript invia una richiesta al server e il server restituisce il contenuto del file richiesto. In che modo Javascript riceve i contenuti? Ecco a cosa serve la funzione di callback. Nel caso di Edward, cioè

    client.onreadystatechange = function() {

e nel caso di Danb, lo è

 function(data) {

Questa funzione viene chiamata ogni volta che arrivano i dati. La versione jQuery utilizza implicitamente Ajax, semplifica la codifica incapsulando quel codice nella libreria.

Aggiornamento 2020: utilizzo di Fetch con async / await

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

Si noti che awaitpuò essere utilizzato solo in una asyncfunzione. Un esempio più lungo potrebbe essere

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');

Questo dovrebbe funzionare in quasi tutti i browser:

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

Inoltre, c'è la nuova FetchAPI:

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

Quando si lavora con jQuery, anziché utilizzare jQuery.get, ad es

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");
});

potresti usare ciò .loadche ti dà una forma molto più condensata:

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

.loadti dà anche la possibilità di caricare pagine parziali che possono tornare utili, vedi api.jquery.com/load/ .

Se l'input è stato strutturato come XML, è possibile utilizzare la importXMLfunzione. (Maggiori informazioni qui su quirksmode ).

Se non è XML e non esiste una funzione equivalente per l'importazione di testo normale, è possibile aprirlo in un iframe nascosto e quindi leggere i contenuti da lì.