jQuery读取XML文件内容的方法_Javascript教程-查字典教程网
jQuery读取XML文件内容的方法
jQuery读取XML文件内容的方法
发布时间:2016-12-30 来源:查字典编辑
摘要:本文实例讲述了jQuery读取XML文件内容的方法。分享给大家供大家参考。具体实现方法如下:复制代码代码如下:jQuery读取XML文件h1...

本文实例讲述了jQuery读取XML文件内容的方法。分享给大家供大家参考。具体实现方法如下:

复制代码 代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>jQuery读取XML文件</title>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<style type="text/css">

h1{color:Green;text-align:center;}

body{ background-color:#EEEEEE ; font-family:微软雅黑; }

#showresult{width:600px;overflow:hidden;}

</style>

<script type="text/javascript" src="jquery/1.4.4/jquery.min.js"></script>

<script type="text/javascript">

$(document).ready(function () {

$("#read").click(function () {

$.ajax({

//请求方式为get

type: "GET",

//xml文件位置

url: "sitemap.xml",

//返回数据格式为xml

dataType: "xml",

//请求成功完成后要执行的方法

success: function (xml) {

$(xml).find("url").each(function (i) {

//i从0开始,累加,如果要显示所有数据,将判断去除即可

if (i < 10) {

//链接地址

var location = $(this).find("loc").text();

//显示文字

var text = $(this).find("loc").text();

//动态加载方法:链接地址

$("<a>").attr("href", location)

//显示文字

.text(text)

//设置样式

.css({ "width": "700px", "float": "left", "margin-bottom": "5px" })

//加载到div

.appendTo("#showresult");

}

})

}

});

return false;

});

});

</script>

</head>

<body>

<div id="showresult">

<h1>jQuery读取XML文件</h1>

<a id="read" href="#">点击读取XML</a>

</div>

</body>

</html>

希望本文所述对大家的jQuery程序设计有所帮助。

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类