保哥開啟了一個有趣的議題: 解決在 IE 下無法將 HTML/XML 轉成 jQuery 物件的問題 。當傳回的內容是XML,若未將HttpRequest的dataType設為"xml",最後在處理XML時,會發生在Firefox上可行但在IE不成功的結果。

因為好奇,追了一下jQuery的Source Code,發現關鍵出在這裡:

    httpData: function( xhr, type, filter ) {
        var ct = xhr.getResponseHeader("content-type"),
            xml = type == "xml" || !type && ct && ct.indexOf("xml") >= 0,
            data = xml ? xhr.responseXML : xhr.responseText;

當dataType=="xml"時,data會傳回responseXML(一個XML DOM物件),否則傳回responseText(字串)。換句話說,當dataType沒設定成"xml"時,Firefox正確地將$("<root>...</root>")轉成了XML DOM,但IE卻沒有。

先前有一篇小文談過用jQuery解析XML,裡面提到直接字串轉XML時,前後要加上<xml></xml>才行(我想當時的測試環境就是以IE為準),試了將字串改寫成<xml><root></root></xml>,果然就可以在IE上成功執行。

這回我對於沒加<xml></xml>在IE裡會發生什麼事有點興趣,這部分在上次的文章中沒有深入探討,只知會失敗。於是這次我做了以下的實驗:

alert($("<root><item>Text</item></root>").size());

嘿! 有趣的地方來了,上面這段Code在IE裡會得到5(Firefox裡則是1)。然後再進一步剖析:

        var o = $("<root><item>Text</item></root>");
        o.each(function() { alert(this.outerHTML); });

在IE下我得到<ROOT>, <ITEM>, undefined, </ITEM>, </ROOT>五項內容,再仔細深入,Text被解析成Text Node,因此沒有outerHTML,但o[2].data就可以取得字串內容。

頗奇怪的解析結果,似乎沒什麼大用,僅滿足好奇心而已。


Comments

# by Ausir

原來是這樣~ 很受用呢!!~ 又學到了 corAusir 程式逗設計 - 提供設計資料與程式設計 - blog.corausir.org 或 點我的名字參觀喔

# by David

Hi,想跟您請教一個問題 我今天希望抓取Google天氣的API來使用,然後我發現了一個詭異的問題,我用一隻php去動態抓取Google Weather API,他會以xml的格式回傳,然後我用jQuery去剖析結構,在非IE的瀏覽器怎麼弄都work,但IE不管dataType設定xml或者html都不work,後來發現把同樣的內容貼近副檔名改成xml的檔案裡面,IE就Work了,不知道你有沒有遇過此情況。 完整的資訊在這 http://groups.google.com.tw/group/jquery-en/browse_thread/thread/61b6e5eee3d04190?hl=zh-TW

# by Jeffrey

to David, 我建議dataType設"xml",而在echo file_get_contents('http://www.google.com/ig/api? weather=Taipei'); 之前,宣告header('Content-type: text/xml'); 試試。

# by name5566

Well... Really, it doesn't work *at all*. You're not using an XML parser. It's an HTML parser. $('<xml><image src="hello.jpg"></image></xml>').find('image').length === 0; Why not use a real XML parser? function parseXML( xml ) { if( window.ActiveXObject && window.GetObject ) { var dom = new ActiveXObject( 'Microsoft.XMLDOM' ); dom.loadXML( xml ); return dom; } if( window.DOMParser ) return new DOMParser().parseFromString( xml, 'text/xml' ); throw new Error( 'No XML parser available' ); } A quick test: var dom = parseXML('<foo what="isit"><bar>howdy</bar></foo>'); var $dom = $(dom);

# by Jeffrey

to name5566, Yeah, as my conclusion said, this test is useless, just for fun. The real XML parser is used in my jQuery XMLDOM extension plugin: http://bit.ly/dvsK6j .

Post a comment