欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

jQuery怎么读取XML文件内容

程序员文章站 2022-03-24 20:49:21
...
这次给大家带来jQuery怎么读取XML文件内容,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" })
                                //加载到p
                            .appendTo("#showresult");
                            }
                        })
                    }
                });
                return false;
            });
        });
    </script>
</head>
<body>
    <p id="showresult">
        <h1>jQuery读取XML文件</h1>
        <a id="read" href="#" style="width:700px;">点击读取XML</a>
    </p>
</body>
</html>

相信看了本文案例你已经掌握了方法,更多精彩请关注其它相关文章!

推荐阅读:

PHP+jQuery插件异步上传文件步骤详解

jQuery如何转换url地址获取url目录

以上就是jQuery怎么读取XML文件内容的详细内容,更多请关注其它相关文章!