2016-11-23 10 views
4

私のウェブサイトでXMLファイルを読むと、画像へのパスを実際の画像に変換しようとしています。私のXMLの構造は次のとおりです。どのような上記のコード行はありませんが、現在ある人物1とするために、すべての情報を読み込みJQueryを使用してXML画像パスを画像に変換する

$("#container").append($(xmlDoc).find('person[id="1"]').text() + '<br/>') 

:私は私のページ上のXMLに読んでいますか

<?xml version="1.0" encoding=UTF=8?> 
    <peopleNetwork> 
    <person id="1"> 
     <name>Alice</name> 
     <friend>Ruby</friend> 
     <image>images/ruby.jpg</image> 
    </person> 
    <person id="2"> 
     <name>Tom</name> 
     <friend>Katty</friend> 
     <image>images/ketty.jpg</image> 
    </person> 
    </peopleNetwork> 

ですこれと同様に、テキスト形式で表示します

アリスルビー画像/ ruby​​.jpg私がすることができたオンラインで検索

私は何をしたい、実際の画像に画像のパスに変換され、私は一緒にこれらを置くことができるかわからない、私はかなり新しいですし、それで遊んでみました

<img src"images/' +$(this).find("image").text() + '"alt=$(this).find('person[id="1"]').text()>); 

が、それぞれの試行で失敗しました - 任意の助けをいただければ幸い、私がいたなら、私に知らせ:このコードを書きます十分にはっきりしない。

EDITED:私はこれが正しいかどうかわからないが、私は私のウェブサイトを実行するとき、それはあなたがちょうど作成するために必要な、このエラーに

Uncaught ReferenceError: Invalid left-hand side in assignment 

答えて

0

を与える

$("#container").append('<div class"peopleNetwork"><img src="images/' + $(xmlDoc).find("image").text() + alt="' + $(xmlDoc).find('person[id="1"]').text()) 

:私はこれを書きました.append()ステートメント内の<img>タグ

$.ajax({ 
 
\t type: "GET", 
 
\t url: "./peopleNetwork.xml", 
 
\t datatype: "xml", 
 
\t success: function(xml){ 
 
\t \t var xmlDoc = $.parseXML(xml), 
 
\t \t $xml = $(xmlDoc); 
 
\t \t $xml.find("person").each(function(){ 
 
\t \t \t var image = $(this).children("image").text(); 
 
\t \t \t $("#container").append($(this).children("name").text() + " " + $(this).children("friend").text() + " " + '<img src="./' + image + '">' + "<br />"); 
 
\t \t }); 
 
\t } 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="container"> 
 
</div>

関連する問題