如何使用javascript中的get命令读取本地文本文件

how to read local text file with get command in javascript

本文关键字:文本 文件 读取 命令 何使用 javascript 中的 get      更新时间:2023-09-26

我正试图用JavaScript中的get命令打开一个文本文件,这样我就可以在html中填充一个标记,但我似乎在这方面没有任何进展。该文本文件与我的html位于同一文件夹中。我想单击我创建的按钮并更改div标记。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html>
    <head>
<title>Glorious Final </title>
<meta name="keywords" content="" />
<meta name="description" content="" />
    <link rel="stylesheet" href="css.css" type="text/css" media="screen" charset="utf-8"/>
    <script src="jquery-1.4.4.min.js" type="text/javascript" charset="utf-8"></script>

    <script src="script.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body>
<div id="six-point-star"></div>
<h1>JQuery Jedi </h1>
<div id="ornamentRow1"></div>
<p>
<h2>Ajax  Admiral</h2>
<div id="ornamentRow2"></div>
</p>
<h3>Javascript Janitor</h3>
<div id="custom"></div>
<h4>
    <button type="button" id="twinkle" >Twinkle Me Starmo</button>
    <button type="button" onclick="hangOrnament1()">Hang First Ornament</button>
    <button type="button" onclick="">Hang More Ornaments</button>
</h4>
<h5>
    <button type="button" onclick="">!!Open Me!!</button>
</h5>
    </body>
    </html>

Noe,这是我想在一个名为script.js的文档中使用的javaScript函数。我认为这就是出错的地方

    function hangOrnament1()
    {
    //open "ornaments.txt" and change the innerHTML of the "ornamentRow1" div tag
    if (window.XMLHttpRequest)
    {// code for IE7+, Firefox, Chrome, Opera, Safari
     xmlhttp=new XMLHttpRequest();
    }
    else
    {// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
    {
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("ornamentRow1").innerHTML=xmlhttp.responseText;
    }
    }
    xmlhttp.open("GET","ornaments.txt",true);
    xmlhttp.send(null);
    }

我认为问题出在这个javascript函数底部的"GET"行,但我不知道该怎么办。我已经阅读了几个小时的表格,试图自己找到解决方案,但没有成功。

使用以下JQuery代码。(如果您正在使用chrome,请确保它已启用--allow file access from files选项:(假设您有一个id="Para1"的段落/div标记)

var s="";
$.get('./ornaments.txt', function(data) {    
    var lines = data.split("'n");
    $.each(lines, function(n, elem) {
                       s=s+"<br/>"+elem;
             });
});
$("#Para1").html(s);

`