jquery 读取XML 文件并按时间进行排序

IT后浪

已于 2024-07-13 19:04:49 修改

阅读量1.3k

点赞数

分类专栏： jquery 文章标签： jquery xml apache

于 2016-09-21 13:57:16 首次发布

本文链接：https://blog.csdn.net/aaalk1001/article/details/52607095

版权

jquery 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

在开发中遇到了一个很烦躁的问题，就说在jdk 1.4 的情况下，读取远程的XML文件不能自动断开，于是就想到了，用jQuery来写。在测试的时候使用的是本地的文件，可到最后发现，jQuery存在跨域的问题，百般无奈，最后就用Apache 代理的方式才算最终解决问题，下面看代码:

html 文件，需要引入相关的jQuery ！

<!DOCTYPE html>
<html>
  <head>
	<meta charset="UTF-8">
    <title>index.html</title>
	<script type="text/javascript" src="jquery-1.4.4.min.js"></script>
	<script type="text/javascript">
	
$(document).ready(function(){ 
	   function root(title,datetime,linkurl,isnew){
		   this.title=title;
		   this.datetime=datetime;
		   this.linkurl=linkurl;
		   this.isnew=isnew;
		}
		var objectList = new Array();
		
			  $.ajax({
				  url: 'test2.xml',
				  dataType: 'xml',  
				  type: 'GET',
				  timeout: 3000,  
				  async: false, 
				  cache: false, 
				  error: function(xml){  
					  alert("loading xml error");  
				  },  
				  success: function(xml){  
					  $(xml).find("CONTENT").each(function(i){
						  var title = $(this).children("TITLE").text();   
						  var datetime = $(this).children("DATETIME").text();   
						  var linkurl = $(this).children("LINKURL").text();   
						  var isnew = $(this).children("ISNEW").text();   
						  objectList.push(new root(title,datetime,linkurl,isnew));
					  });
					  writeText();
				  },
					
			  }); 
	  
		
		
		
			  function writeText(){
					var dbwjList=0;
					var zbwjList=0;
					objectList.sort(function(a,b){
						return (new Date((b.datetime).replace(/-/g,'/'))).getTime()-(new Date((a.datetime).replace(/-/g,'/'))).getTime();
					 });
					var tmpaa="";
					var tmpbb="";
					for(var i=0;i<objectList.length;i++ ){
						if(objectList[i].isnew=="1"){
							dbwjList++;
							if(dbwjList<=6){
								var aa="<tr><td><a title="+objectList[i].title+" href="+objectList[i].linkurl+" target=\"_blank\">"+objectList[i].title.substring(0,42)+"</a></td><td>"+objectList[i].datetime+"</td></tr>"
								tmpaa=tmpaa+aa;
							}
						}
						if(objectList[i].isnew=="0"){
							 zbwjList++;
							 if(zbwjList<=4){
								 var bb="<tr><td><a title="+objectList[i].title+" href="+objectList[i].linkurl+" target=\"_blank\">"+objectList[i].title.substring(0,42)+"</a></td><td>"+objectList[i].datetime+"</td></tr>";
								 tmpbb=tmpbb+bb;
							 }
						}
					}
					$("#dbwj").html(tmpaa);
					$("#zbwj").html(tmpbb);
					if(dbwjList==0){
						$("#dbwj").html("<tr><td>暂无待办文件</td></tr>");
					}
					if(zbwjList==0){
						$("#zbwj").html("<tr><td>暂无在办文件</td></tr>");
					}
					 $("#spa_daiban_count").html(dbwjList);
					 $("#spa_zaiban_count").html(zbwjList);
				}
	   
	}); 

</script>

  </head>
  
  <body>
    
    
<table>
  <tr><td>待办文件(<span id="spa_daiban_count">加载中...</span>)个</td></tr>
  <tr><td><table id="dbwj"><!-- 在此追加待办文件 --></table></td></tr>
  
  <tr><td>在办文件(<span id="spa_zaiban_count">加载中... </span>)个</td></tr>
  <tr><td><table id="zbwj"><!-- 在此追加在办文件 --></table></td></tr>
</table>
    
    
    
  </body>
</html>

下面是XML文件：

<?xml version="1.0" encoding="GB2312"?>
<ROOT>
<CONTENT>
<TITLE><![CDATA[信息一]]></TITLE>
<DATETIME><![CDATA[2016-09-21]]></DATETIME>
<LINKURL><![CDATA[https://www.baidu.com/]]></LINKURL>
<ISNEW><![CDATA[1]]></ISNEW>
</CONTENT>
<CONTENT>
<TITLE><![CDATA[信息二]]></TITLE>
<DATETIME><![CDATA[2016-09-22]]></DATETIME>
<LINKURL><![CDATA[https://www.baidu.com/]]></LINKURL>
<ISNEW><![CDATA[1]]></ISNEW>
</CONTENT>
<CONTENT>
<TITLE><![CDATA[信息三]]></TITLE>
<DATETIME><![CDATA[2016-09-20]]></DATETIME>
<LINKURL><![CDATA[https://www.baidu.com/]]></LINKURL>
<ISNEW><![CDATA[1]]></ISNEW>
</CONTENT>
</ROOT>

把这两个文件拷贝到项目当中，应该就没有问题了，此处的XML文件还是使用本地的，如果访问远程的XML 则要使用Apache 做代理!