编程 Javascript

jQuery读取XML文件内容的方法

Posted in Javascript onMarch 09, 2015

本文实例讲述了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="#" style="width:700px;">点击读取XML</a>

    </div>

</body>

</html>

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

jQuery读取XML文件内容的方法

- Author -

hcqenjoy

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

Jquery 模拟用户点击超链接或者按钮的方法

Oct 25 Javascript

js获取网页可见区域、正文以及屏幕分辨率的高度

May 15 Javascript

Node.js中使用计时器定时执行函数详解

Aug 15 Javascript

JavaScript中的pow()方法使用详解

Jun 15 Javascript

Clipboard.js 无需Flash的JavaScript复制粘贴库

Oct 02 Javascript

jquery制作属于自己的select自定义样式

Nov 23 Javascript

利用浮层使select不可选的实现方法

Dec 03 Javascript

node学习记录之搭建web服务器教程

Feb 16 Javascript

Angular.JS中指令ng-if、ng-show/ng-hide和ng-switch的使用教程

May 07 Javascript

Vue异步组件处理路由组件加载状态的解决方案

Sep 07 Javascript

Vue.js组件使用props传递数据的方法

Oct 19 Javascript

vue render函数动态加载img的src路径操作

Oct 26 Javascript

JQuery动态添加和删除表格行的方法

Mar 09 #Javascript

Python脚本后台运行的几种方式

Mar 09 #Javascript

JS控制表格实现一条光线流动分割行的方法

Mar 09 #Javascript

JS实现点击按钮自动增加一个单元格的方法

Mar 09 #Javascript

JS实现网页表格自动变大缩小的方法

Mar 09 #Javascript

EasyUI中datagrid在ie下reload失败解决方案

Mar 09 #Javascript

JS控制网页动态生成任意行列数表格的方法

Mar 09 #Javascript

You might like

php动态变量定义及使用

2015/06/10 PHP

PHP请求远程地址设置超时时间的解决方法

2016/10/29 PHP

PHP正则+Snoopy抓取框架实现的抓取淘宝店信誉功能实例

2017/05/17 PHP

php实现与python进行socket通信的方法示例

2017/08/30 PHP

php常用字符串长度函数strlen()与mb_strlen()用法实例分析

2019/06/25 PHP

Laravel实现通过blade模板引擎渲染视图

2019/10/25 PHP

msn上的tab功能Firefox对childNodes处理的一个BUG

2008/01/21 Javascript

js GridView 实现自动计算操作代码

2009/03/25 Javascript

AJAX使用了UpdatePanel后无法使用alert弹出脚本

2010/04/02 Javascript

超酷的网页音乐播放器DewPlayer使用方法

2010/12/18 Javascript

基于json的jquery地区联动效果代码

2011/07/06 Javascript

原生js实现查找/添加/删除/指定元素的class

2013/04/12 Javascript

jQuery仿Excel表格编辑功能的实现代码

2013/05/01 Javascript

解决json日期格式问题的3种方法

2014/02/02 Javascript

jQuery中多个元素的Hover事件解决方案

2014/06/12 Javascript

bootstrap flask登录页面编写实例

2016/11/01 Javascript

详解Angular Reactive Form 表单验证

2017/07/06 Javascript

Vue2.0利用vue-resource上传文件到七牛的实例代码

2017/07/28 Javascript

JS中使用media实现响应式布局

2017/08/04 Javascript

深入浅析javascript继承体系

2017/10/23 Javascript

Jquery让form表单异步提交代码实现

2019/11/14 jQuery

在Python上基于Markov链生成伪随机文本的教程

2015/04/17 Python

深入解析Python中的WSGI接口

2015/05/11 Python

python安装oracle扩展及数据库连接方法

2017/02/21 Python

python 动态加载的实现方法

2017/12/22 Python

详解Python核心对象类型字符串

2018/02/11 Python

Python实现读取Properties配置文件的方法

2018/03/29 Python

django rest framework 数据的查找、过滤、排序的示例

2018/06/25 Python

python实现年会抽奖程序

2019/01/22 Python

创业计划书——互联网商机

2014/01/12 职场文书

创意婚礼策划方案

2014/05/18 职场文书

法定代表人授权委托书范文

2014/08/02 职场文书

大学生联谊活动策划书（光棍节）

2014/10/10 职场文书

责任书格式

2015/01/29 职场文书

政审证明材料

2015/06/19 职场文书

Python源码解析之List

2021/05/21 Python