学习笔记——JavaScript操作XML文件

曾经终败给现在 2022-03-19 09:50 277阅读 0赞

通过一个实例来具体了解关于JavaScript来操作XML文件特性

跨浏览器读取xml文件

<html>
    <head>
    	<script type="text/javascript">
    		function createDocument()
    		{
    			var xmlDoc;
    			if(window.ActiveXObject)//IE中依靠ActiveXObject()对象和MSXML库来获取和打开xml文档
    			{
    				var versions=[
    							"Msxml2.DOMDocument.6.0",//MSXML库有多种版本，一般只检查这两个
    							"Msxml2.DOMDocument.3.0"//优先新版
    							 ];
    				for(var i=0;i<versions.length;i++)
    				{
    					try
    					{
    						xmlDoc=new ActiveXObject(versions[i]);//用ActiveXObject对象构造函数，
    						return xmlDoc;//需要传入一个包含ActiveX对象版本的字符串
    					}
    					catch (error)//若创建ActiveX对象失败，则转入这里，但是什么也不做
    					{
    						//do nothing here
    					}
    				}
    			}
    			else if(document.implementation && document.implementation.createDocument)
    			{//适用于Firefox、Opera，依然不适用Safari和Chrome
    				xmlDoc=document.implementation.createDocument("","",null);
    				return xmlDoc;
    			}
    			return null;
    		}
    		function getDailyMessage()
    		{
    			var messages=xmlDoc.getElementsByTagName("daily");
    			//注意此处使用的xmlDoc在此函数中没有定义，那么来自哪里呢？
    			//在HTML页面正文中定义的xmlDoc全局变量
    			var dateobj=new Date();
    			var today=dateobj.getDay();
    			return messages[today].firstChild.nodeValue;
    		}
    	</script>
    </head>
    <body>
    	<div id="messageContainer"></div>
    	<script type="text/javascript">
    		var xmlDoc=createDocument();//全局变量，同样用于getDailyMessage函数中
    		xmlDoc.async=false;//解释见下面
    		xmlDoc.load("motd.xml");
    		document.getElementById("messageContainer").innerHTML=getDailyMessage();
    	</script>
    </body>
    </html>

在实际操作xml文件之前，先确保该文档已经完全加载到客户端的浏览器缓存中。否则，脚本在xml文件  
下载完成之前操作，会抛出JavaScript错误。  
  
  
可以使用async避免这样的错误(通用方法)。  
async属性表示浏览器下载页面其余部分之前，是否等待指定的xml文档下载完。这个属性表示  
“异步(asynchronous)”。默认值是true，表示浏览器无需等待xml文档完全下载。因此只要我们将其值  
设置为false，就可以避免前面的问题  
  
在IE中可使用readyState属性  
IE的xml对象和很多的HTML对象都有readyState属性，用于返回对象之前的加载状态。  
readyState属性的可能的返回值如下：  
1 //对象正在初始化，尚无任何可读数据，正在载入数据（loading）  
2 //对象正在载入对象并解析（loaded）  
3 //部分对象的数据已经读取并解析，因此对象模型是可用的。  
//但是仍无法读取完整的对象数据（interactive）  
4 //对象已经载入，内容已经完全解析完毕（completed）  
在这里我们只需要关注一个等于4的状态就行了。  
举例：  
function xmlDoc\_readyStateChange()  
\{  
if(xmlDoc.readyState==4)alert("XML file loaded");  
\}  
var xmlDoc=createDocument();  
xmlDoc.onreadystatechange=xmlDoc\_readyStateChange;  
xmlDoc.load("myfile.xml");  
  
  
在Firefox、Opera中使用onload  
注意，在Firefox。Opera中不支持使用readyState来判断文档的加载状态，  
而是在文件加载完，且DOM对象可用时，执行onload事件处理程序  
举例：  
function xmlDoc\_load()  
\{  
alert("XML is loaded");  
\}  
var xmlDoc=document.implementation.createDocument("","",null);  
xmlDoc.οnlοad=xmlDoc\_load;

xmlDoc.load("myfile.xml");

在与上面HTML同文件夹下再建一个如下xml文件

<?xml version="1.0" ?>
    
    <messages>
    	<daily>Today is Sunday</daily>
    	<daily>Today is Monday</daily>
    	<daily>Today is Tuesday</daily>
    	<daily>Today is Wednesday</daily>
    	<daily>Today is Thursday</daily>
    	<daily>Today is Friday</daily>
    	<daily>Today is Saturday</daily>
    </messages>