AJAXで画像付きのXMLを読み込む

Question

私はAJAXの世界を初めて知っています。だから私のn00bishnessを許してください。私はこのようなXML文書を持っている：

<juices> 
<smoothie id="SY4301"> 
    <name>Strawberry Yumghurt</name> 
    <price currency="GBP"> 
     <perunit type="wholesale">1.23</perunit> 
     <perunit type="RRP">1.89</perunit> 
     <percrate>28.50</percrate> 
    </price> 
    <description>Velvety yoghurt smoothie made with fresh strawberry and rasperries.</description> 
    <ingredients> 
     <ingredient image="/images/strawberry.jpg" quantity="9">Strawberries</ingredient> 
     <ingredient image="/images/Raspberry.jpg" quantity="4">Raspberries</ingredient> 
     <ingredient image="/images/yoghurt.jpg"quantity="200ml">Greek Yoghurt</ingredient> 
     <ingredient image="/images/honey.jpg" quantity="30ml">Runny Honey</ingredient> 
     <ingredient image="/images/milk.jpg"quantity="40ml">Semi-skimmed Milk</ingredient> 
    </ingredients> 
    <nutrition per="100ml"> 
     <kcal unit="cal">140</kcal> 
     <kjoules unit="KJ">442</kjoules> 
     <carbohydrate unit="g">27.9</carbohydrate> 
     <protein unit="g">1.4</protein> 
     <fat unit="g">8.4</fat> 
     <fibre unit="g">2.8</fibre> 
    </nutrition> 
    <imageloc>http://www5.bbk.ac.uk/~akaufm01/jvfma/Images/Products/morning_kick.jpg</imageloc> 
</smoothie> 
</juices> 

私は、ページの読み込みに成分以外のすべてをロードしているXSLドキュメントを持っていますが、私が達成したいことはそれが（リンクやボタンをクリックする上で、Iドンどちらかのdivs（#description）の内容を、画像が添付されている成分のリストに置き換えます。その位置は画像属性に格納されます。

私は、これを達成するためにjQueryを使用することを提案するチュートリアルを見てきましたが、これを動作させることに多くの幸運はありませんでした。 JSでXMLHttpRequest関数を使用することもできますが、どちらの方が優れているかはわかりません。

アドバイスをいただければ幸いです！ jQueryを使って呼び出され、AJAXを作るためにそこにさまざまな方法が、のが基本的な属性

//Handle the ajax in the event click of your button with ID MyButton 
$('#MyButton').click(function(){ 
    $.ajax({ 
     type: "Type of your http Request could be GEt or Post", 
     url: " the url where you obtain that xml", 
     data: "ïf you need to pass some data to the url" 
     dataType: "in your case should be XML which is the data type that you're going to handle in the success function", 
     success: function(data){ 
      //parse your xml which it contains in the var data 
      //You could set the data parse in your div with a append or html method 
     }'define a function or put a function already defined', 
     error: 'define a function in case of error' 
    }); 
}); 

Here's the doc about an ajax in jqueryを使用させているため

おかげで、 アンディは

Answer 1

はよく最初にあなたはAJAXで何をしているかを理解する必要があります

Here's you can find the documentation of the method about

。0