当前位置: 首页 > 图文教程 > 网络编程 > Javascript > jQuery 行级解析读取XML文件(附源码)

Javascript
IE8 原生JSON支持
iframe 自适应高度[在IE6 IE7 FF下测试通过]
javascript 清除输入框中的数据
IE和FireFox(FF)中js和css的不同
JavaScript asp.net 获取当前超链接中的文本
用JavaScript页面不刷新时全选择,全删除(GridView)
JavaScript获取GridView选择的行内容
javaScript 读取和设置文档元素的样式属性
js select 控制实现代码
javascript 类方法定义还是有点区别
jQuery 绝对入门
网页开发中的容易忽略的问题 javascript HTML中的table
childNodes 用法两例
js 只能输入数字和小数点的文本框改进版
javascript 09年最新版的省市联动
jquery 实现的全选和反选
js 拖拽翻页实现代码
保证JavaScript和Asp、Php等后端程序间传值编码统一
JavaScript 无符号右移赋值操作
JavaScript 无符号右移运算符

Javascript 中的 jQuery 行级解析读取XML文件(附源码)


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-01-10   浏览: 578 ::
收藏到网摘: n/a

项目中应用jQuery解析读取XML语言配置文件来实现语言的调度。这是jQuery解析读取XML文件功能的测试源码,现拿出来分享。 最近在做一个项目,因为页面使用了Cookie,所以要判断用户的浏览器是否支持Cookie,并提示用户如何开启浏览器的Cookie功能。同时,整个项目要配置多语言支持,包括中文、越南语、日语和英语,所以必须有语言配置文件。项目中应用jQuery解析读取XML语言配置文件来实现语言的调度。这是jQuery解析读取XML文件功能的测试源码,现拿出来分享。
目录结构:  
main.css文件代码:
复制代码 代码如下:

@CHARSET "UTF-8";
* {
margin: 0px;
padding: 0px;
}
body {
width: 800px;
text-align: left;
font-size:62.5%;
font: normal 0.75em tahoma, helvetica, sans-serif;
}
#Message_error {
height:16px;
color:#000;
line-height:16px;
background:#fcc url(image/msg_error.png) no-repeat;
margin-bottom:2px;
border-bottom:#faa 1px solid;
padding-left:20px;
overflow:hidden;
display:none;
}
#Message_success {
height:16px;
line-height:16px;
color:#000;
background:#cfc url(image/msg_success.png) no-repeat;
margin-bottom:2px;
border-bottom:#afa 1px solid;
padding-left:20px;
overflow:hidden;
display:none;
}

index.html文件代码:
复制代码 代码如下:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>jQuery行级读取XML文件</title>
<link rel="stylesheet" href="main.css" href="main.css" type="text/css"/>
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="browser.js" ><script>
</head>
<body>
<div id="Message_success"></div>
<div id="Message_error"></div>
</body>
</html>

MsgConfig_zh.xml文件代码:
复制代码 代码如下:

<?xml version="1.0" encoding="utf-8"?>
<Msg-Config>
<msg id="1" name="cookie-support">
<message>你的浏览器不支持Cookie,请开启浏览器的Cookie功能</message>
<message-help>点击查看开启Cookie方法</message-help>
<message-url>index.html</message-url>
</msg>
<msg id="2" name="load-xml">
<message>jQuery读取节点XML成功</message>
</msg>
</Msg-Config>

browser.js文件代码:
复制代码 代码如下:

$(document).ready(function() {
/* Check the browser if open Cookie support.
* ----------------------------------------------------- */
//navigator.cookieEnabled == true意为浏览器支持Cookie功能
//navigator.cookieEnabled == false时指浏览器没有开启Cookie功能
//因为我的浏览器已经开启了Cookie功能,此处设为true是为了检测效果
if(navigator.cookieEnabled == true){
$.ajax({
url:"MsgConfig_zh.xml", //XML文件相对路径
type:"POST", //发送请求的方式
dataType:"xml", //指明文件类型为“xml”
timeout:1000, //超时设置,单位为毫秒
error:function(xml){ //解析XML文件错误时的处理
$("#Message_error").text("Error loading XML document (加载XML文件出错)"+xml);
$("#Message_error").show();
},
success:function(xml){
//遍历Msg-Config,查找节点“msg”并且节点id=1的节点
$(xml).find("Msg-Config>msg[id=1]").each(function(){
var Msg_value = $(this).find("message").text(); //获取子节点message的值
var Msg_help = $(this).find("message-help").text(); //获取子节点message-help的值
var Msg_url = $(this).find("message-url").text(); //获取子节点message-url的值
//将获取的值经过组合以.html()方式添加到页面的层Message_error中
//这里是用.html()方式,它会处理文本中的html代码
//如果是用.text()方式,则会将诸如<a><font color>等HTML代码原封不动的输出到页面
$("#Message_error").html(Msg_value+" <font color='blue'><b><a href=""+Msg_url+"" href=""+Msg_url+"">"+Msg_help+"</a></b></font>");
//层Message_error本来是隐藏的,添加值之后使其显示
$("#Message_error").show();
});
//遍历Msg-Config,查找节点“msg”并且节点id=2的节点
$(xml).find("Msg-Config>msg[id=2]").each(function(){
var Msg_value = $(this).find("message").text(); //获取子节点message的值
$("#Message_success").html(Msg_value); //将获取的值以.html()方式添加到页面的层Message_error中
$("#Message_success").show();
});
}
});
}
});

最终结果展示: