html显示本地xml文件内容

实现浏览本地xml文件,将文件内容全部显示在html的textarea中,但目前编码还是显示不出来

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML xmlns="http://www.w3.org/1999/xhtml">
 <HEAD>
  <script type='text/javascript'>
    function showcurcity(){
     var url = document.getElementById("file1").value;
     if(url==null||url==''){
      alert("请先选择文件!");
     return;
     }
   var xmlDoc = null;
   if(window.ActiveXObject){
    xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
    xmlDoc.async="false"
    xmlDoc.load(url);
   }
   document.getElementById("datastr").value=xmlDoc.xml;
  }
  </script>
 </HEAD>

 <BODY>
 <input type="file" id="file1" /><br/>
 <textarea name="datastr" id="datastr" cols="45" rows="8"></textarea>
 <input type="button" value="显示xml" onclick="showcurcity();"></button>
 </BODY>
</HTML>

当时参考的网址:http://blog.sina.com.cn/s/blog_5517d0cf0100kpch.html

1、检测当前浏览器支不支持XML DOM

<script type="text/javascript">
   function createXMLDOM()
   {
    var arrsignatures=["MSXML2.DOMDocument.5.0","MSXML2.DOMDocument.4.0","MSXML2.DOMDocument.3.0","MSXML2.DOMDocument","Microsoft.XmlDom"];
    for(var i=0;i<arrsignatures.length;i++)
    {
     try
     {
      var oXmlDom=new ActiveXObject(arrsignatures[i]);//匹配客户端版本。
      return oXmlDom;
     }
     catch(oError)
     {}
    }
    throw new Error("MSXML not installed on your system.");
   }
   var oXml=createXMLDOM();//创建一个XML DOM对象。
   alert(oXml);
  </script> 

2、载入XML

(1)oXml.load("XXX.xml");主要用于从服务器上载入XML文件,且该方法只能载入与包含JS的页面存储在同一服务器上的XML文件,而不能跨服务器载入文件。

(2)oXml.loadxml("<element></element>");用于直接向xml dom对象当中输入XML字符串。

<script type="text/javascript">

   var oXml=createXMLDOM();

   oXml.async=false;//以同步模式载入文件。

   oXml.load("xxx.xml");

   alert("root is :"+oXml.documentElement.tagName);

   alert("root has children number:"+oXml.documentElement.childNodes.length);

</script>

(3)常以异步的方式载入文件,用readyState来指定载入的状态,用onreadystatechange事件来响应结果。

readyState值:

0:DOM尚未初始化。

1:DOM正在读取消息。

2:DOM完成数据信息读取。

3:DOM部分可用。

4:DOM完全可用,即数据被完全载入。

<script type="text/javascript">

   var oXml=createXMLDOM();

      oXml.load("xxx.xml");

     if(oXml.readyState==4)

      {

           alert(oXml.readyState);

      }

</script>

或:

<script type="text/javascript">

   var oXml=createXMLDOM();

      oXml.load("xxx.xml");

      oXml.onreadystatechange=stateChange();

function stateChange()

{

   if(oXml.readyState==4)

      {

           alert(oXml.readyState);

      }

}

    

</script>

 3、读取XML

直接用oXML.xml就可以读取XML文件内容;

4、检测错误

直接使用parseError,会返回errorCode的值。只要errorCode!=0,则表示有错。

errorCode:表示所发生的错误类型的数字代号

filePos:错误发生在文件中的位置

line:遇到错误的行号

linePos:在遇到错误的那一行上的字符位置

reason:错误解释

srcText:造成错误的代码

url:造成错误的文件的URL

如:

<script type="text/javascript">

   var oXml=createXMLDOM();

      oXml.load("xxx.xml");

   if(oXml.parseerror!=0)

   {

      var oError=oXml.parseError;

      alert("error code:"+oError.errorCode+"Line:"+oError.line+"Line Pos:"+oError.linepos+"Reason:"+oError.reason);    

</script>

猜你喜欢

转载自yeluotiying.iteye.com/blog/2093081
今日推荐