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程序设计有所帮助。

Javascript 相关文章推荐
快速保存网页中所有图片的方法
Jun 23 Javascript
多个表单中如何获得这个文件上传的网址实现js代码
Mar 25 Javascript
javascript 按键事件(兼容各浏览器)
Dec 20 Javascript
终于实现了!精彩的jquery弹幕效果
Jul 18 Javascript
JavaScript制作颜色反转小游戏
Sep 25 Javascript
jQuery层级选择器实例代码
Feb 06 Javascript
基于angular2 的 http服务封装的实例代码
Jun 29 Javascript
Vue组件通信的四种方式汇总
Feb 08 Javascript
JavaScript设计模式之构造函数模式实例教程
Jul 02 Javascript
详解vue中组件参数
Jul 09 Javascript
详解微信小程序canvas圆角矩形的绘制的方法
Aug 22 Javascript
JavaScript实现拖拽功能
Feb 11 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 远程文件管理,可以给表格排序,遍历目录,时间排序
2009/08/07 PHP
PHP利用REFERER根居访问来地址进行页面跳转
2013/09/28 PHP
使用Curl进行抓取远程内容时url中文编码问题示例探讨
2013/10/29 PHP
利用浏览器的Javascript控制台调试PHP程序
2014/01/08 PHP
自写的利用PDO对mysql数据库增删改查操作类
2018/02/19 PHP
js判断undefined变量类型使用typeof
2013/06/03 Javascript
使用javascript获取页面名称
2014/12/23 Javascript
jQuery实现简单的文件上传进度条效果
2020/03/26 Javascript
AngularJS单选框及多选框实现双向动态绑定
2016/01/13 Javascript
jquery实现可旋转可拖拽的文字效果代码
2016/01/27 Javascript
在Docker快速部署Node.js应用的详细步骤
2016/09/02 Javascript
JavaScript实现简易的天数计算器实例【附demo源码下载】
2017/01/18 Javascript
knockoutjs模板实现树形结构列表
2017/07/31 Javascript
layui form表单提交之后重新加载数据表格的方法
2019/09/11 Javascript
vue选项卡切换登录方式小案例
2019/09/27 Javascript
微信小程序scroll-view隐藏滚动条的方法详解
2020/03/25 Javascript
深入分析JavaScript 事件循环(Event Loop)
2020/06/19 Javascript
[02:26]2018DOTA2亚洲邀请赛赛前采访-Newbee篇
2018/04/03 DOTA
Python采用socket模拟TCP通讯的实现方法
2014/11/19 Python
详解Python中的Cookie模块使用
2015/07/06 Python
对pandas里的loc并列条件索引的实例讲解
2018/11/15 Python
Django项目中实现使用qq第三方登录功能
2019/08/13 Python
美国男士和女士奢侈品折扣手表购物网站:Certified Watch Store
2018/06/13 全球购物
Hunkemöller瑞士网上商店:欧洲最大的内衣品牌之一
2018/12/03 全球购物
Levi’s西班牙官方网站:李维斯,著名的牛仔裤品牌
2020/08/20 全球购物
通息工程毕业生自荐信
2013/10/16 职场文书
三好学生自我鉴定
2013/12/17 职场文书
班长自荐书范文
2014/02/11 职场文书
烹饪自我鉴定
2014/03/01 职场文书
建筑投标担保书
2014/05/20 职场文书
预备党员综合考察材料
2014/05/31 职场文书
国家税务局领导班子对照检查材料思想汇报
2014/10/04 职场文书
心灵捕手观后感
2015/06/02 职场文书
会议室管理制度范本
2015/08/06 职场文书
浅谈怎么给Python添加类型标注
2021/06/08 Python
JS 基本概念详细介绍
2021/10/16 Javascript