XMLをAjax経由で取得した要素にアクセスできない
- XMLをAjax経由で受け取り、JavaScript内で処理をした際、特定の要素にアクセスできない問題が発生しています。
- 具体的には、XML内の<jcity></jcity>のタグを繰り返しで表示させたいが、何も表示されない状態です。
- 原因や解決策についてご教授いただけますか。
- ベストアンサー
配列内のnodeValueがとれない
XMLをAjax経由で受け取り、JavaScript内で処理をしたのいのですが、 XML要素にうまくアクセスできません。 具体的には、下記のＸＭＬの、 <jcity></jcity>のタグを繰り返しでalert表示をさせたい （alert(r.childNodes[0].nodeValue)）の部分で、、 何も表示されません。 原因などわかればご教授いただけますでしょうか。 よろしくお願いいたします。 ------以下、XML------------------------------- <?xml version="1.0" encoding="UTF-8" standalone="yes"?> <items> <item> <jcity>千代田区</jcity> <jlocal>千代田</jlocal> <jpref>東京都</jpref> <pref_cd>13</pref_cd> <zip_cd>1000001</zip_cd> </item> </items> ------以下、JavaScript------------------------------- function rssFeed() { var myAjax = new Ajax.Request( 'http://myserver.co.jp/modules/api/rssfeed.class.php', { method: 'GET', onSuccess: showResponse, onFailure: errorFunc } ); } function showResponse(req) { r = req.responseXML; $A(r.getElementsByTagName('item')).each(function(r) { alert(r.childNodes[0].nodeValue); }); }
- maenoina
- お礼率31% (26/82)
- JavaScript
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Q3904978 TestCase 1</title> <script type="text/javascript" src="prototype-1.6.0.2.js"></script> <script type="text/javascript"> function rssFeed() { var myAjax = new Ajax.Request( 'Q3904978-1.php', { method: 'GET', onSuccess: showResponse, onFailure: errorFunc } ); } function showResponse(req) { r = req.responseXML; $A(r.getElementsByTagName('item')).each(function(e) { //個人的に混乱しないように前と後の変数名を変えておく alert(e.getElementsByTagName("*")[0].childNodes[0].nodeValue); }); //言っておくが,e.childNodes[0]は「改行1つ」をnodeValueに持つテキストノードな //今回は,item要素の中で「全ての要素」(テキストノードを含まない)のセット //の0番目(jcity要素)のchildNodes[0](テキストノード)のnodeValueを取ってきたから //「千代田区」が表示される。 //まあ,ぶっちゃけた話, //alert(e.getElementsByTagName("*")[0].childNodes[0].nodeValue); //よりも //alert(e.getElementsByTagName("jcity")[0].childNodes[0].nodeValue); //の方が自然。 //俺が最も好きなのはXPathを使うパターン。どっかで実装を拾ってこなきゃいけないのが面倒くさそうだが。 //なお,このコードはwell-formedであるが,教えてgooの仕様により //well-formedでなくなって動かないかもしれない。その時は適宜編集して使うこと } function errorFunc(){ //きちんと定義 alert("error"); } </script> </head> <body onload="rssFeed();"> </body> </html>
関連するQ&A
- Flashにブログ更新情報を表示する
Flash初心者です。 Flashにブログのatom（rss.xml）を読み込み ブログタイトルや、最新の記事タイトル３つを表示させようと思っています。 ちょうど良いサイトがあり、 http://allabout.co.jp/gs/flash/closeup/CU20090926E/ に従い、１フレーム目に ============================================================ System.useCodepage = true; newsData = new XML(); newsData.ignoreWhite = true; newsData.load("（自身のブログTOPへのフルパス）/atom.xml"); ↑（GoogleのBlogger）のrss.xmlをフルパスで指定しました。↑ ============================================================ と指定し、 １０フレーム目に ============================================================ //サイトのタイトルを取得 siteTitle = newsData.firstChild.childNodes[0].childNodes[2].nodeValue; //サイトのURLを取得 siteUrl = newsData.firstChild.childNodes[0].childNodes[6].nodeValue; //記事タイトルを格納する変数 item1Title = newsData.firstChild.childNodes[0].childNodes[13].childNodes[4].nodeValue; item1Url = newsData.firstChild.childNodes[0].childNodes[13].childNodes[10].nodeValue; item1Title = newsData.firstChild.childNodes[0].childNodes[14].childNodes[4].nodeValue; item1Url = newsData.firstChild.childNodes[0].childNodes[14].childNodes[10].nodeValue; item1Title = newsData.firstChild.childNodes[0].childNodes[15].childNodes[4].nodeValue; item1Url = newsData.firstChild.childNodes[0].childNodes[15].childNodes[10].nodeValue; //整形してテキストボックスに表示 // site.htmlText = "<b><a href='" + siteUrl + "'>" + siteTitle + "</a></b>"; item.htmlText = "<b>新着情報</b>" if(item1Title != undefined){ item.htmlText += "<a href='" + item1Url + "'>" + item1Title + "</a>"; } if(item2Title != undefined){ item.htmlText += "<a href='" + item2Url + "'>" + item2Title + "</a>"; } if(item3Title != undefined){ item.htmlText += "<a href='" + item3Url + "'>" + item3Title + "</a>"; } ============================================================ と指定したxmlに合わせてxmlの内容の取り出し指定を変更しましたが、 「URL '（自身のブログTOPへのフルパス）/atom.xml' を開く処理のエラー」 という出力エラーが出てしまいます。 理解せずに作っているので、何が悪いのかまったくわかりません。 よろしくお願いいたします。
- 締切済み
- Flash
- ｘｍｌをjavascriptで読み込み、HTMLに表示させようとしてい
ｘｍｌをjavascriptで読み込み、HTMLに表示させようとしています。 IEでは出来たのですが、それ以外でのブラウザでどうしても読み込むことが出来ません。 簡単なｘｍｌを作ります。例えばこの『これを表示』というテキストをfirefoxで表示させたい場合はどのように書けば良いのでしょうか？ <?xml version="1.0" encoding="UTF-8"?> <items> <item>これを表示</item> </items> 今はこのようなｊｓを作っています。 アラートのAAAでxmlのテキストを表示させるようにしたいのですが・・・ ノードへのアクセス方法？が間違っているのはわかっているんです。ただ、検索して調べても色々出てきて、色々試しても上手くいかず・・・どうしても分がわかりません。 すみません、どなたかご指摘お願い致します！！ xmlData = new XMLHttpRequest(); // XMLドキュメントをDOMで扱うためのオブジェクトを作る xmlData.overrideMimeType("sample.xml"); // XMLドキュメントを読み込む var AAA = xmlItemData.documentElement.childNodes[1].childNodes[1].text; alert(AAA); 宜しくお願い致します。
- 締切済み
- JavaScript
- XMLのタグの有無をPHPで判定したい。
example1.xml ----------------------- <item> <color>red</color> <omake>candy</omake> </item> ----------------------- example2.xml ----------------------- <item> <color>black</color> </item> ----------------------- 上記はXMLファイルの２パターンを示したものです。 商品(item)によって、オマケ（omake)があったりなかったりします。 オマケがない時には、タグ自体存在しません。 なので、タグがない時に、そのデータをDOMで取得しようとすると、 エラーが吐かれます。 Notice: Trying to get property of non-object in～～～ 私がしたいことは、 タグがない場合には、値を取得しない。 という分岐をさせることです。 例えば、 $items = $doc->getElementsByTagName('color'); if(isset($items)){echo $items->item(0)->nodeValue;} こんな感じで考えたのですが、ダメでした。 タグが無くても、$itemsはＮＵＬＬではないため、 if文の中に入ってしまい、 結局、$items->item(0)->nodeValue; を通過しようとして、 Notice: Trying to get property of non-object in～～～ が吐かれます。 （$itemsは、object(DOMNodeList)#3 (0) { }といった内容で、ＮＵＬＬではない。） また、 if(isset($items->item(0)->nodeValue)){ echo $items->item(0)->nodeValue; } のようにすると、 isset()のところで、やはり、 $items->item(0)->nodeValue を通過しようとして、 Notice: Trying to get property of non-object in～～～ が吐かれます。 こういった場合、どうしたら良いのでしょうか。 宜しくお願いします。 （ＰＨＰ５の環境です。）
- ベストアンサー
- PHP
- 配列をhtmlで参照
javascriptで作成した配列の要素をhtmlのセレクトボックスの値として 参照したいんですが、どのようにすればいいんでしょうか？ <html><body> <select name="セレクト"> <option >セレクトボックス <option value="1st item">1st item //ここに配列items[]の値を代入したい <option value="2nd item">2nd item <option value="3nd item">3nd item <option value="4nd item">4nd item <option value="5nd item">5nd item </select><br> <script language="Javascript"> function Item(name, count) { this.name = name this.count = count } function cmp_func(lhs, rhs) { return rhs.count - lhs.count } items = new Array(10) items[0] = new Item("apple", 12) items[1] = new Item("orange", 34) items[2] = new Item("banana", 15) items[3] = new Item("grape", 99) items[4] = new Item("strawberry", 7) items[5] = new Item("rasberry", 55) items[6] = new Item("blueberry", 22) items[7] = new Item("lemon", 4) items[8] = new Item("nable", 33) items[9] = new Item("pear", 44) items.sort(cmp_func) for (i=0; i<items.length; i++) document.write(items[i].count, ":", items[i].name,"<br>") </script></body></html> たびたび質問すいませんが、よろしくご教授願
- ベストアンサー
- JavaScript
- Ajax データが取得できない
現在、AJAXを勉強中です。以下のhtmlを実行し、pref.jsを呼び出すコードをサイトから引用して記述しました。 しかし、「データを取得する」ボタンを押すと、【処理中です・・・】というメッセージが出るだけで、いっこうに該当データを取得できません。(本来であれば、指定されたxmlファイル内のデータが表示されるはずなのですが・・） 何が原因なのでしょうか。 解決策がわかる方がいらっしゃいましたらご教授ください。 よろしくお願いします。 ■pref.html --------------------------------- <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="../lib/prototype.js"></script> <script type="text/javascript" src="pref.js"></script> <link href="pref.css" rel="stylesheet" type="text/css"> <title>pref</title> </head> <body> <div> <input type="button" id="btnData" value="データ取得" /> <input type="button" id="btnClear" value="クリア" /> </div> <div id="state"></div> <div id="result"></div> </body> </html> --------- ■pref.js ---- onload = init; var state; var result; function init() { $("btnData").onclick = prefDisp; $("btnClear").onclick = clearDisp; state = $('state'); result = $('result'); } function prefDisp() { state.innerHTML = "処理中です・・・<br />\n"; var url = "http://ws.bzen.net/pgtop/pref.xml"; var paramList = ""; new Ajax.Request(url, { method: 'get', onSuccess: getData, onFailure: showErrMsg, parameters: paramList }); function getData(data){ var response = data.responseXML.getElementsByTagName('Response'); var item = response[0].getElementsByTagName('Item'); var tmpHtml=""; for(i = 0; i < item.length; i++){ var prefCd = item[i].getElementsByTagName('PREF_CD'); var prefCdValue = prefCd[0].firstChild.nodeValue; var prefName = item[i].getElementsByTagName('PREF_NAME'); var prefNameValue = prefName[0].firstChild.nodeValue; tmpHtml += prefCdValue + " " + prefNameValue + "<br />\n"; } result.innerHTML = tmpHtml; state.innerHTML = "データを取得しました。<br />\n"; } function showErrMsg(){ clearDisp(); state.innerHTML = "データを取得できませんでした。<br />\n"; } } function clearDisp() { state.innerHTML = ""; result.innerHTML = ""; } ---
- ベストアンサー
- AJAX
- クイズ作成に関して xml形式の問題をランダムに読み込む方法
現在、クイズを作っています。 外部のXMLファイルから問題を読み込み、それをランダムに5問出題させ、さらに重複させないようにしたいのですが、経験不足のため思うように出来ません。 flashファイル //////////////////////////////////// var a_xml:XML = new XML(); a_xml.onLoad = function() { var top:XMLNode = a_xml.firstChild; for(i = 0; i<top.childNodes.length;i++){ var item:XMLNode = top.childNodes[i]; trace(item.attributes.name); } } a_xml.ignoreWhite = true; a_xml.load("xml/test.xml"); //////////////////////////////////// XMLファイル test.xml //////////////////////////////////// <?xml version="1.0" encoding="UTF-8"?> <items> <item name="test1" value="0" /> <item name="test2" value="1" /> <item name="test3" value="2" /> <item name="test4" value="3" /> <item name="test5" value="4" /> <item name="test6" value="5" /> </items> //////////////////////////////////// XMLファイルの読み込みは何とかできたのですが、ここからどうやってランダムに読み込むかが分かりません。 XML要素のnameをランダムで出題したい場合どうしたらいいのですか？ ここから先は、多分Math.randomを使うのだろうというレベルでしか分からないため、なんとかご教授お願いできませんか？ 環境はwin,FlashMX2004です。
- ベストアンサー
- Flash
- 特定のページの画像ＵＲＬ一覧表示をしようと思っているのですが、
特定のページの画像ＵＲＬ一覧表示をしようと思っているのですが、 何が原因なのか解らず困っています。 <html> <head> <script> function load(){ var req = new XMLHttpRequest(); req.open("GET", "http://news.google.co.jp/nwshp?hl=ja&tab=wn", false); req.onreadystatechange = function(){ if(4 == req.readyState){ set_news(req.responseXML); } }; req.send(null); } function set_news(xml){ var container = document.getElementById("news"); container.innerHTML = ""; var items = xml.getElementsByTagName("img"); for(var i = 0; i < items.length; i++){ var a = document.createElement("a"); a.href = items[i].getAttribute("src"); a.innerHTML = items[i].getAttribute("src"); container.appendChild(a); } } </script> </head> <body onLoad="load();"> <div id="news"></div> </body> </html> 上記はgoogleの画像ＵＲＬ一覧を取得しようと思っています。 この場合、何が悪いのでしょうか？ ご教示宜しくお願いいたします。
- 締切済み
- JavaScript
- googlemapAPIとXML-RPC
お世話になります。 「Googleマップ+Ajaxで自分の地図をつくる本」という書籍を読んで勉強しております。 書籍のサンプルコードを実際に動作させてみたところ、動きません。 googlemapオブジェクトのPOSTが正常に動作していないか、もしくはXML-RPCが正常に 動作していないかだと思うのですが解決できません。 お分かりになる方いらっしゃいましたら、ご教授ください。 ■サンプルコードの一部を転記します。 ■javascript function xmlRpc( server, method, params, callbackfunc ) { var xml_param = "<?xml version=\"1.0\" encoding=\"UTF-8\"?>"; xml_param += "<methodCall>"; xml_param += "<methodName>" + method + "</methodName>"; xml_param += "<params>"; for( var i=0; i < params.length ; i++ ) { xml_param += "<param>"; xml_param += "<value>" + params[i] + "</value>"; xml_param += "</param>"; } xml_param += "</params>"; xml_param += "</methodCall>"; var req = GXmlHttp.create(); req.open("POST", server , true ); req.onreadystatechange = function() { if(req.readyState == 4 ) { if( callbackfunc != null ) callbackfunc(req.requestXML); } } ★ req.setRequestHeader("Content-Type", "text/xml; charset=UTF-8"); req.send(xml_param); ■PHP $request = $HTTP_RAW_POST_DATA; $server = xmlrpc_server_create(); xmlrpc_server_register_method( $server, "addLocation", "addLocation" ); xmlrpc_server_register_method( $server, "deleteLocation", "deleteLocation" ); xmlrpc_server_register_method( $server, "editPlace", "editPlace" ); xmlrpc_server_register_method( $server, "deletePlace", "deletePlace" ); ■補足 javascriptからXML-RPC（PHPに記述）のメソッドを指定し、各種メソッドではDB処理が行われています。 javascript中の★のところまで通っていることをalert()で確認しましたが、PHPは一切通っていない ようです。 ■以下２つの環境で動作確認しております。 (1)自宅マシン ・OS windows XP SP2 ・XAMPP Ver1.7.0インストール ・PEARのXML-RPCはインストール済み (2)レンタルサーバ ・さくらのレンタルサーバ スタンダード ・phpinfo()にてPEARのXML-RPCインストールを確認済み
- 締切済み
- JavaScript
- 複数のxmlを同ページに読み込みたい
同じ項目をもつxmlをカテゴリ別に複数作成された状態で、同一html上にjqueryで読み込みたいです。 var xmlFiles=new Array("a.xml","b.xml","c.xml"); $(document).ready(function(){ for(var i=0;i<xmlFiles.length;i++){ $.ajax({url: '',type: 'GET', dataType: 'xml',timeout: 100000,error: function(){alert('xmlファイルの読み込みに失敗しました');}, success: function(xml){ 処理 } }); } }); これだとおかしくなってしまいます。 $.ajax～～を読み込み名を変えて繰り返し記述してもうまくいかないのですが、これは１つのxmlにするしかないのでしょうか。
- 締切済み
- JavaScript
- テキストファイルの内容を変数に格納したい
$(function() { $item = ""; $.ajax({ url: 'data/data.txt', success: function($data) { $item = $data; } }); alert($item); }); 上記のように外部のテキストファイルを読み込んで、その中身の文字列をajaxの外で宣言している変数に格納したいのですが、何も格納できていません。 テキストファイルのパスが間違っているということや、中身が何もないということはありません。 ajaxのsuccess内にalertを置いた場合は値が正しく表示されるのですが、ajaxの外ではやっぱだめです。 ajaxではなくloadでやろうとも思ったのですが、loadの場合はHTML上のタグにしか出力できないので、今回の目的には合いません。 なんとかして、変数にテキストファイルの中身を渡せないのでしょうか。
- ベストアンサー
- JavaScript
お礼
無事に意図した動作をさせる事ができました！ありがとうございます。 ＤＯＭの考え方が曖昧だった部分が少しクリアになりました。XPathについては初めて聞いたので調べてみましたが、もっと直感的な記述ができそうですね。勉強してみたいと思います。