- ベストアンサー
ajaxで読み込んだDOMに対してinnerHTML
ajaxで読み込んだDOMに対してinnerHTMLをしようとすると"undefined"と なってしまい、何も読み込めません。 ajaxで読み込んだDOMに対してタグや要素付きのテキストを取得する事は出来ますでしょうか。 宜しくお願いします。
- take_july
- お礼率54% (88/162)
- JavaScript
- 回答数4
- ありがとう数5
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
DocumentにはinnerHTMLはないっぽい ルート要素などのElementにはあるようだけど。 #innerHTMLは元々Microsoftの独自拡張だと思っているので,MSDNの資料を参考にした。 http://msdn.microsoft.com/en-us/library/aa752641(VS.85).aspx http://msdn.microsoft.com/en-us/library/aa752574(VS.85).aspx http://msdn.microsoft.com/en-us/library/aa752541(VS.85).aspx http://msdn.microsoft.com/en-us/library/aa752529(VS.85).aspx http://msdn.microsoft.com/en-us/library/aa752514(VS.85).aspx http://msdn.microsoft.com/en-us/library/cc288669(VS.85).aspx http://msdn.microsoft.com/en-us/library/aa752298(VS.85).aspx #実装されてないみたいだけどHTML 5の仕様見ると何故かDocumentにinnerHTMLがあるんだよね。 http://www.w3.org/html/wg/html5/#documents0 =================== 個人的にはDOM 3 Load And Saveを使って createLSSerializer とかしてほしいんだけどね。実装されているのOperaだけだけど http://www.w3.org/TR/DOM-Level-3-LS/idl-definitions.html == MozillaはあまりDOM 3 LSの実装に乗り気じゃないっぽい。独自実装あるけど。 http://developer.mozilla.org/En/XMLSerializer IEは不明。
その他の回答 (3)
- 神崎 渉瑠（@taloo）
- ベストアンサー率44% (1016/2280)
う～ん。。。 responseXMLでinnerHTMLは基本的に使わないので詳しく知らなかったんですが。。。 HTMLでのDOMとXMLでのDOMは別物と考えた方が良さそうですね。 もしかしたらinnerHTML自体存在しないかも知れません。 var doc=document.createElement('div'); doc.innerHTML=req.responseText; として、docから取り出すとか。。。 document.createDocumentFragment()の方が適していると思うんですが、その後の処理が出来ない（getElementsByTagNameとかinnerHTMLがない）ので。 以下のどれかを使う（ブラウザ依存）の方がいいのかも知れませんが、結局innerHTMLが入ってないかも知れません。 ActiveXObject('Microsoft.XMLDOM') DOMParser() document.implementation.createDocument('','',null); いずれにしても面倒くさいというか、変な処理になりそうです。 別件になりますが、このように改行してある場合 <country> <testtag testattr="1"> 国１ </testtag> </country> countryエレメントのfirstChildがテキストノード（改行コードまたはそれを半角スペースに変換した物）になるかもしれません。 HTMLでは「開始タグ直後の改行コードと、終了タグ直前の改行コードは無視する」というルールがあるのですが、そのルールが適用されていないブラウザが有るようです。 http://www.w3.org/TR/html401/appendix/notes.html#h-B.3.1 > This applies to all HTML elements without exception 注意書きに有るとおり文法上は、ブロック要素の開始タグ、終了タグにも適用されます。 XMLでこういうルールがあるかどうかわかりませんが、 私はfirstChildを使わずに、childNodesを順番に調べて最初に出てきたnodeTypeが１のノードを取得するという、 非常に面倒くさい方法を取っています。 ためしに <country><testtag testattr="1"> 国１ </testtag> </country> このように書くとcountry[0].firstChild.firstChild.nodeValueで「国１」が取れました。 ただしescape()すると、前後に改行コードが入っています。（Win Fx2.0） function GetFirstChild(elm){ for(var i=0;i<elm.length;i++) if(elm[i].nodeType==1) return elm[i]; return null; } ご参考まで。
お礼
ありがとうございました。 自分で変換する処理を作って対応する事にしました。 大きいxmlだと重くなっちゃいましたが。。
- 神崎 渉瑠（@taloo）
- ベストアンサー率44% (1016/2280)
「ajaxで読み込んだDOM」とは何ですか？ xmlデータのことかも知れませんが、何なのかわからないので、出来るとも出来ないとも言えません。 どの様に書かれたのかわからないので、もし出来るとしても何が間違っているのかわかりません。 書かれたソースをお願いします。
補足
****下記HTMLです。**** <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script type="text/javascript" src="/lib/ajax.js"></script> <script type="text/javascript"> <!-- // 指定したURLを非同期でリクエスト function getFile( url ) { sendRequest( url, writeData, 'GET', '' ); } // レスポンスデータを表示 function writeData( req ) { // <result>要素を参照 var result = req.responseXML.getElementsByTagName('result'); // 出力先のトップ要素となるtable要素 var table = document.getElementById("result"); // tableの内容クリア var child = table.childNodes; var length = child.length; for(var i = 0; i < length; i++) { table.removeChild(child[0]); } // 各行を出力 for(var i = 0; i < result.length; i++) { var trElem = document.createElement('tr'); table.appendChild(trElem); // <country>要素を出力 var country = result[i].getElementsByTagName('country'); alert(country[0].innerHTML); var text = document.createTextNode(country[0].firstChild.firstChild.nodeValue); var tdElem = document.createElement('td'); tdElem.appendChild(text); trElem.appendChild(tdElem); } } //--> </script> </head> <body> <div> <input type="button" value="データ読込" onclick="getFile('test.xml')"/> </div> <table> <thead><tr><th>見出し１</th></tr></thead> <tbody id="result"></tbody> </table> </body> </html> ****以下取得するTMLです。**** <?xml version="1.0" encoding="utf-8"?> <results> <result> <country> <testtag testattr="1"> 国１ </testtag> </country> </result> <result> <country> <testtag testattr="1"> 国２ </testtag> </country> </result> </results> javascriptの中でノードに対して alert(country[0].innerHTML); としてみたのですが、駄目でした。 宜しくお願いします。
- himajin100000
- ベストアンサー率54% (1660/3060)
/* 自分がIE用に検証に使ったソース */ str = "a"; relativeURI = "Q4282941-2.xml" var xmlhttprequest = new XMLHttpRequest(); if (relativeURI.indexOf("?") < 0){ relativeURI = relativeURI + "?"; } xmlhttprequest.open('GET', relativeURI + ('X' + (new Date()).getMilliseconds().toString()) + '=1' , false); xmlhttprequest.send(null); if(xmlhttprequest.status !== 200){ throw new Error("HTTP Status could not be 200:"); } alert(xmlhttprequest.responseXML.getElementsByTagName("html")[0].xml) /* FirefoxやOperaやSafariで発生したトラブル解決,で終わりだと思ってたら IEでダメだった。やる気しないが,一応追調査してみた。 IXMLDOMNodeっぽいかも。ただし,これはread-only http://msdn.microsoft.com/en-us/library/ms761386(VS.85).aspx */
![その他([技術者向] コンピューター) イメージ](https://gazo.okwave.jp/okwave/spn/images/related_qa/c205_4_thumbnail_img_sm.png)
お礼
色々情報提供有難うございます。 やはり出来ないんですかね。