JQuery读取并解析xml

JQuery版本：jquery-1.4.2.min.js

需要通过IIS才能正确运行

DEMO.html

代码

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

    <head>

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

        <title>StripingTable</title>
        <script src="jquery-1.4.2.min.js" type="text/javascript"></script>

        <script type="text/javascript">

            $(document).ready(function () {
                $.get('myData.xml', function (d) {

                    $('body').append('<h1> Saturn给你推荐几本书： </h1>');
                    $('body').append('<dl />');



                    $(d).find('book').each(function () {

                        var $book = $(this);
                        var title = $book.attr("title");
                        var description = $book.find('description').text(); //这里是读取字段内容
                        var imageurl = $book.attr('imageurl');     //这里是读取字段属性值

                        var html = '<dt> <img class="bookImage" alt="" src="' + imageurl + '" /> </dt>';
                        html += '<dd> <span class="loadingPic" alt="Loading" />';
                        html += '<p class="title">' + title + '</p>';
                        html += '<p> ' + description + '</p>';
                        html += '</dd>';

                        $('dl').append($(html));

                        $('.loadingPic').fadeOut(2000);
                    });
                });
            });

        </script>
    </head>

    <body>
    <div>
        <div id="info"></div>
    </bdoy>

</html>

myData.xml

代码

<?xml version="1.0" encoding="utf-8" ?>
<book>
    <book title="藏地密码" imageurl="images/Tibet_Code.jpg">
        <description>
            这里是书本的介绍
        </description>
    </book>

<book title="剑桥雅思6" imageurl="images/ielts.jpg">
        <description>
          这里是书本的介绍
    </description>
    </book>

    <book title="Professional ASP.NET" imageurl="images/asp.jpg">
        <description>
             这里是书本的介绍
         </description>
    </book>
</book>