我试图通过创建一个函数来实现一个简单的文本文件阅读器，该函数接受文件的路径并将每行文本转换为字符数组，但它不起作用。
function readTextFile() {
var rawFile = new XMLHttpRequest();
rawFile.open("GET", "testing.txt", true);
rawFile.onreadystatechange = function() {
if (rawFile.readyState === 4) {
var allText = rawFile.responseText;
document.getElementById("textSection").innerHTML = allText;
}
}
rawFile.send();
}
这里出了什么问题?
这似乎仍然不工作后，改变了代码一点点从以前的修订，现在它给我一个XMLHttpRequest异常101。
我已经在Firefox上测试过了，它可以工作，但在谷歌Chrome中，它不会工作，它一直给我一个101例外。我怎么能让它不仅在Firefox上工作，而且在其他浏览器(尤其是Chrome)上工作?
function readTextFile(file) {
var rawFile = new XMLHttpRequest(); // XMLHttpRequest (often abbreviated as XHR) is a browser object accessible in JavaScript that provides data in XML, JSON, but also HTML format, or even a simple text using HTTP requests.
rawFile.open("GET", file, false); // open with method GET the file with the link file , false (synchronous)
rawFile.onreadystatechange = function ()
{
if(rawFile.readyState === 4) // readyState = 4: request finished and response is ready
{
if(rawFile.status === 200) // status 200: "OK"
{
var allText = rawFile.responseText; // Returns the response data as a string
console.log(allText); // display text on the console
}
}
}
rawFile.send(null); //Sends the request to the server Used for GET requests with param null
}
readTextFile("text.txt"); //<= Call function ===== don't need "file:///..." just the path
-从javascript读取文件文本
-控制台日志文本从文件使用javascript -谷歌chrome和mozilla firefox在我的情况下，我有这样的文件结构:
console.log结果:
如果你想提示用户选择一个文件，那么读取它的内容:
// read the contents of a file input
const readInputFile = (inputElement, callback) => {
const reader = new FileReader();
reader.onload = () => {
callback(reader.result)
};
reader.readAsText(inputElement.files[0]);
};
// create a file input and destroy it after reading it
const openFile = (callback) => {
var el = document.createElement('input');
el.setAttribute('type', 'file');
el.style.display = 'none';
document.body.appendChild(el);
el.onchange = () => {readInputFile(el, (data) => {
callback(data)
document.body.removeChild(el);
})}
el.click();
}
用法:
// prompt the user to select a file and read it
openFile(data => {
console.log(data)
})
此函数适用于浏览器和打开文件选择对话框，在用户选择后将文件读取为二进制并调用读取数据的回调函数:
function pickAndReadFile(callback) {
var el = document.createElement('input');
el.setAttribute('type', 'file');
el.style.display = 'none';
document.body.appendChild(el);
el.onchange = function (){
const reader = new FileReader();
reader.onload = function () {
callback(reader.result);
document.body.removeChild(el);
};
reader.readAsBinaryString(el.files[0]);
}
el.click();
}
像这样使用它:
pickAndReadFile(data => {
console.log(data)
})
是的，JS可以读取本地文件(参见FileReader())，但不是自动的:用户必须将文件或文件列表传递给脚本，html <input type="file">。
然后使用JS可以处理(示例视图)文件或文件列表，它们的一些属性和文件或文件内容。
出于安全原因，JS不能自动(不需要用户输入)访问其计算机的文件系统。
为了允许JS自动访问本地fs，需要创建一个hta文档而不是一个包含JS的html文件。
hta文件可以包含JS和VBS。
但是hta可执行文件只能在windows系统上运行。
这是标准的浏览器行为。
也谷歌Chrome在fs API工作，更多信息在这里:http://www.html5rocks.com/en/tutorials/file/filesystem/
您需要检查状态0(当使用XMLHttpRequest在本地加载文件时，您不会返回状态，因为它不是来自web服务器)
function readTextFile(file)
{
var rawFile = new XMLHttpRequest();
rawFile.open("GET", file, false);
rawFile.onreadystatechange = function ()
{
if(rawFile.readyState === 4)
{
if(rawFile.status === 200 || rawFile.status == 0)
{
var allText = rawFile.responseText;
alert(allText);
}
}
}
rawFile.send(null);
}
在你的文件名中指定file://:
readTextFile("file:///C:/your/path/to/file.txt");
