Q&A
あ、調べたら、3.x系でもIE9+の対応のようでした。失礼いたしました。
「xmlファイルの値をHTMLに表示する」というシンプルな事をしたいのですが検索しても複雑なコードしか発見出来ず構文すら分からない状態です。
◆不明点
以下のxmlファイルの「<name="Emily">」の「Emily」を、
HTMLファイル「<div class = "name"><p id = "htmlId">Name</p></div>」のpタグ内「Name」に入れたいのですが構文が分かりません。。
↓test.xml
<?xml version="1.0" encoding="utf-8" standalone="yes"?> <English> <name="Emily"> </name> </English>
↓Sample.html
<!DOCTYPE ～～～ > <html> <head> ～～ </head> <body> <div class = "name">**<p id = "">Name</p>**</div> </body> </html>
↓ajax.js
function getXmlData() { var filePath = "test.xml"; var data = new XMLHttpRequest(); data.open("GET",filePath); data.send(); data.onload = function(){ //読み込み完了時の実行内容 var date = data.responseXML; var html = document.getElementById("htmlId"); //HTMLファイル内のid名(htmlId)を変数「html」に代入 var xml = date.getElementsByTagName("name"); //XMLファイルのタグ「name」を変数「xml」に入れる html = xml; //HTMLにxml(タグ名「name」)を表示させたい };
jsファイルにXMLファイルのデータを取り込み、
取り込んだデータをHTMLに表示させる、といった処理を書いたつもりなのですが上手くいきません。(HTMLに何も表示されない)
恐らく何かが足りないのだと思うのですがそれが何かが分かりません。
XMLファイルのタグを指定する際に<name>タグは<English>タグの中に入っているから
__getElementsByTagName("English")[0];__と指定しなくてはならないでしょうか。
ご教示いただけますと助かります。
よろしくお願いいたします。
この質問の投稿者はすでに退会しているため、質問者からの返信がない点にご留意ください。
回答2件
0
以下のようなエラーが出てしまいます。 jquery.min.js:4 XMLHttpRequest cannot load file:///Volumes/xxxxxx.heteml.jp/xml/text_Port.xml. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https. send @ jquery.min.js:4 ajax @ jquery.min.js:4 getAjaxData @ ajax.js:23 loadAjax @ ajax.js:17 n @ jquery.min.js:2 fireWith @ jquery.min.js:2 ready @ jquery.min.js:2 B @ jquery.min.js:2
Chromeはローカルファイルを開いた状態（ファイルを選択してブラウザで表示）ではAjaxが機能しません。回避方法もありますが、サーバを用意するかFirefoxなど別のブラウザでテストするなどのほうが早いかもしれません。
【ローカル(file:///)上で外部ファイル読み込みのセキュリティ制約を回避するいくつかの方法 - Qiita】
http://qiita.com/nissuk/items/1ede2953a8661dc59214
【【解説付き】chromeでXMLHttpRequestをローカルのファイルで行う方法 - Qiita】
http://qiita.com/growsic/items/a919a7e2a665557d9cf4
【[その他] ChromeにてAjaxでローカルファイルにアクセス - Qiita】
http://qiita.com/cigalecigales/items/33afaa42f91542ffa62e
投稿2017/07/23 07:51
総合スコア69655
0
『jQuery+XMLを読み込む』でググるといろいろ出てきますね。
jquery で xml ファイルを読み込む | hacknote
jQueryでXMLの読み込み＆出力をする
IE9以上条件であれば、jQueryのバージョンは1.x系にした方がいいと思います。
投稿2017/07/21 04:26
総合スコア37806
ありがとうございます。上記読んだのですが構文の意味が読み取れず・・。どこかのページで値表示だけであればfind()とtext()で出力できると知ったのですがそれを使用しての記述方法がイマイチ分からず失敗してしまいます。。
この質問の投稿者はすでに退会しているため、質問者からの返信やベストアンサーの選定がない点にご留意ください。
あなたの回答
tips
プレビュー
