9

xml ファイルのコンテンツを div にロードする方法。

XMLコンテンツをロードする必要があるHTMLは次のとおりです

<div class="editorial" id="news-container">
</div>

XML データ

<contentprogramming>
    <category name = "My t" id = "1">
        <logo>http://123.png</logo>        
        <channel name="res" id= "1" type="ecommerce">            
            <logo>http://11.png</logo>           
            <items>              
                <item id="1">
                    <image>http://11.jpg</image>
                    <title>Memory Card MSMT2G</title>
                    <details>$6.99</details>
                    <linkurl>http://www.test.com/Sony</linkurl>
                </item>
                <item id="2">
                    <image>http://i2.jpg</image>
                    <title>Apple iPad </title>
                    <details>$579.95</details>
                    <linkurl>http://www.test.com/Apple</linkurl>
                </item> 
            </items>
        </channel>
    </category>
</contentprogramming>

そしてxmlファイル名はsomething.xml

私はいくつかの方法を試しましたが、うまくいきませんでした:(

以下の方法を試しましたがうまくいきませんでした。

$('something.xml').find('name').each(function() { 
    $("#news-container").append($(this).text() + "<br />");
});
4

5 に答える 5

19

これを試して：

// Load the xml file using ajax 
$.ajax({
    type: "GET",
    url: "something.xml",
    dataType: "xml",
    success: function (xml) {

        // Parse the xml file and get data
        var xmlDoc = $.parseXML(xml),
            $xml = $(xmlDoc);
        $xml.find('category[name="My t"] logo').each(function () {
            $("#news-container").append($(this).text() + "<br />");
        });
    }
});

参考：1.jQuery.ajax() 2.parseXML ()

于 2013-05-07T10:56:24.110 に答える
3

HTML 特殊文字をエスケープする必要があります。テキストを div に設定する前に、この関数を使用します。

function htmlSpecialChars(unsafe) {
    return unsafe
    .replace(/&/g, "&amp;")
    .replace(/</g, "&lt;")
    .replace(/>/g, "&gt;")
    .replace(/"/g, "&quot;");
}
于 2013-05-07T10:55:06.610 に答える
2

-- 最初に xml ファイルを呼び出す必要があります

    $.ajax({
       url: '/something.xml',
       type: "GET",
       dataType: "xml",
       success: function (result) {
            $(result).find('name').each(function () {
                $("#news-container").append($(this).text() + "<br />");
             }
           }
       });
于 2013-05-07T10:55:23.530 に答える
0

これを試して：

var xml='<contentprogramming><category name = "My t" id = "1"><logo>http://123.png</logo><channel name="res" id= "1" type="ecommerce"><logo>http://11.png</logo> <items><item id="1"><image>http://11.jpg</image><title>Memory Card MSMT2G</title><details>$6.99</details><linkurl>http://www.test.com/Sony</linkurl></item><item id="2"><image>http://i2.jpg</image><title>Apple iPad </title><details>$579.95</details><linkurl>http://www.test.com/Apple</linkurl></item> </items></channel></category></contentprogramming>';
xmlDoc = $.parseXML( xml ),
$xml = $( xmlDoc ),
$xml.find( "category[name='My t'] logo" ).each(function () {
    $("#news-container").append($(this).text() + "<br />");
}
于 2013-05-07T10:57:15.857 に答える