试试使用httprequest
创新互联公司主营云州网站建设的网络公司,主营网站建设方案,app开发定制,云州h5微信小程序定制开发搭建,云州网站营销推广欢迎云州等地区企业咨询
var fileName = "";
var txtFile;
txtFile = new XMLHttpRequest();
txtFile.open("GET",fileName,false);
txtFile.send();
var txtDoc=txtFile.responseText;
希望对你有所帮助
javascript语言本身并不提供系统文件功能。
但javascript的运行环境可能提供文件操作能力。比如说nodejs，javascript当运行在nodejs环境中时，就可以透过node api去主动进行文件读写等操作。但当javascript运行在browser（浏览器）环境中时，就无法主动进行文件读写操作。只能等用户操作文件选择控件之后，被动获取文件的二进制对象。
!DOCTYPE html
html
head
title文件示例/title
meta name="name" content="content" charset="utf-8"
/head
body
input type="file" id="file" /
input type="button" onclick="readText()" value="File Button"
div id="tt"
/div
/body
/html
script charset="utf-8"
window.onload=function () {
if(typeof(FileReader)=="undefined")
{
alert("你的浏览器不支持文件读取");
document.write("");
}else
{
alert("你的浏览器支持文件读取");
}
}
function readText() {
var file=document.getElementById("file").files[0];
var reader=new FileReader();
reader.readAsText(file);
reader.onload=function(data)
{
var tt=document.getElementById("tt")
tt.innerHTML=this.result;
}
}
/script
在有交互的前提下，一般是选择上传文件或将文件拖拽到一个可拖拽的区域
可以通过FileReader API读取文件的内容
如果没有交互，直接读取是不可以的
///////////////////////////////////////////////////////////
首先：xml文件（tree.xml）内容如下：
?xml version="1.0" encoding="gb2312"?
treeview
tree id="p1"
text山东省/text
target_blank/target
title省份/title
link/link
tree id="p1-1"
text威海市/text
target_blank/target
title城市/title
link/link
/tree
tree id="p1-2"
text烟台市/text
target_blank/target
title城市/title
link/link
node id="p1-2-1"
text长夼村/text
target_blank/target
title乡镇/title
link;/link
/node
/tree
node id="p1-3"
text富镇/text
target_blank/target
title乡镇/title
link;/link
/node
/tree
tree id="p2"
text河北省/text
target_blank/target
title省份/title
link/link
tree id="p2-1"
text泊头市/text
target_blank/target
title城市/title
link/link
node id="p2-1-1"
text郊河/text
target_blank/target
title乡镇/title
link;/link
/node
/tree
tree id="p2-2"
text石家庄/text
target_blank/target
title城市/title
link/link
/tree
/tree
tree id="p3"
text浙江省/text
target_blank/target
title省份/title
link/link
tree id="p3-1"
text杭州市/text
target_blank/target
title城市/title
link/link
node id="p3-1-1"
text某镇/text
target_blank/target
title乡镇/title
link;/link
/node
/tree
tree id="p3-2"
text温州市/text
target_blank/target
title城市/title
link/link
node id="p3-2-1"
text某镇/text
target_blank/target
title乡镇/title
link;/link
/node
/tree
/tree
/treeview
//////////////////////////////////////////////////////
然后：javascript函数实现：(文件名称：tree.htm）
script Language="JavaScript"
var HTML = "";
var space = "";
var blank = " ";
function getSubject()
{
var xmlDoc;
if(window.ActiveXObject)
{
//获得操作的xml文件的对象
xmlDoc = new ActiveXObject('Microsoft.XMLDOM');
xmlDoc.async = false;
xmlDoc.load("tree.xml");
if(xmlDoc == null)
{
alert('您的浏览器不支持xml文件读取,于是本页面禁止您的操作,推荐使用IE5.0以上可以解决此问题!');
window.location.href='/Index.aspx';
return;
}
}
//解析xml文件，判断是否出错
if(xmlDoc.parseError.errorCode != 0)
{
alert(xmlDoc.parseError.reason);
return;
}
//获得根接点
var nodes = xmlDoc.documentElement.childNodes;
//得到根接点下共有子接点个数，并循环
for(var i=0; inodes.length; i++)
{
//如果接点名为 tree
if(nodes(i).nodeName == "tree")
{
readTree(nodes(i));
}
//如果接点名为 node
else if(nodes(i).nodeName == "node")
{
readNode(nodes(i));
}
}
//删除对象
delete(xmlDoc);
//显示HTML
window.show.innerHTML = HTML;
return;
}
//读Tree节点
function readTree(cI)
{
var nodes = cI.childNodes;
var menuHTML = space;
menuHTML += blank;
//得到超级链接
menuHTML += "a href='";
//如果该节点的连接属性不为空，则连接
if(cI.selectNodes("link")(0).text != "")
{
menuHTML += cI.selectNodes("link")(0).text;
}
//否则为空链接
else
{
menuHTML += "#";
}
//目标
if(cI.selectNodes("target")(0).text != "")
{
menuHTML += " target='"+cI.selectNodes("target")(0).text;
menuHTML += "'";
}
//点击菜单事件，调用divshow(vid)函数
menuHTML += " onclick=javascript:divshow('"+cI.getAttribute("id")+"');";
//得到节点标题
menuHTML += " title='";
menuHTML += cI.selectNodes("title")(0).text;
//结束
menuHTML += "'";
//得到节点的正文
menuHTML += cI.selectNodes("text")(0).text;
menuHTML += "/abr\n";
//将menuHTML设置添加到HTML字符串
HTML += menuHTML;
//得到该节点的属性值span
HTML += "div id='"+cI.getAttribute("id")+"' style='display:none'\n";
for(var i=0; inodes.length; i++)
{
var tempImg = "";
tempImg += blank;
if(nodes(i).nodeName == "tree")
{
space += tempImg;
readTree(nodes(i));
space = "";
}
else if(nodes(i).nodeName == "node")
{
space += tempImg;
readNode(nodes(i));
}
}
HTML += "/div\n";
return;
}
//读Node节点
function readNode(cI)
{
var nodeHTML = space;
nodeHTML += blank;
//设置超级链接
nodeHTML += "a href='";
//得到连接地址
nodeHTML += cI.selectNodes("link")(0).text;
//目标
if(cI.selectNodes("target")(0).text != "")
nodeHTML += "' target='"+cI.selectNodes("target")(0).text;
//得到节点标题
nodeHTML += "' title='";
nodeHTML += cI.selectNodes("title")(0).text;
//结束
nodeHTML += "'";
//得到节点的正文
nodeHTML += cI.selectNodes("text")(0).text;
nodeHTML += "/abr\n";
HTML += nodeHTML;
//HTML += "div id='"+cI.getAttribute("id")+"'";
space = "";
return;
}
//操作对象的显示还是隐藏效果
function divshow(vid)
{
if(document.all[vid].style.display == "none")
{
document.all[vid].style.display = "block";
}
else
{
document.all[vid].style.display = "none";
}
return;
}
/script
html
head
meta http-equiv="Content-Type" content="text/html; charset=gb2312"
titleJS_XML/title
style type="text/css"
!--
body
{
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
font-size: 9pt;
}
A
{
text-decoration:none;
font-family: "宋体";
font-size: 9pt;
COLOR:#000000;
}
--
/style
/head
body bgcolor="#EEEEEE" leftmargin="0" topmargin="0"
div id=show/div
/body
script
getSubject()
/script
/html
//////////////////////////////////////////////////////////
运行，要在同一个路径下！
获取相对路径的方法：
_nction getPath(){undefined
_ar pathName = document.location.pathname;
_ar index = pathName.substr(1).indexOf("/");
_ar result = pathName.substr(0,index+1);
_eturn result;}
_葱械慕峁牵?
_athName===/test/index.jsp
_esult===/test
_褂梅椒ǎ嚎梢栽_s中用此方法拼接URL：getPath()+/路径1/路径2/........
_avaScript（简称“JS”） 是一种具有函数优先的轻量级，解释型或即时编译型的 编程语言 。
_淙凰亲魑? Web 页面的 脚本语言 而出名，但是它也被用到了很多非 浏览器 环境中，
_avaScript 基于原型编程、多范式的动态脚本语言，并且支持面向对象、命令式和声明式（如 函数 式编程）风格。.
