jQueryでAjaxしたXMLデータで.html()するとIEでエラー

Web jQuery IE9

jQueryで次のような処理を書くとIEでハマるお話。

前提

処理内容

Ajaxを用いてXMLファイルを読み込んだあと、そのXMLデータの中身を .html() で取り出す。

JavaScript
var conf = null;
$.ajax({{
    url: "./data.xml",
    type: "GET",
    dataType: "xml",
    cache: false,
    async: false,
    timeout: 10000,
    success: function(data, textStatus, xhr) {
        conf = $(data).find("conf").html();
    }
});
XML（data.xml）
<conf>
    <span class="sample">サンプル</span>
</conf>

FireFoxだとこれで動くんだけどIEだと以下のようなエラーが出てしまう。

SCRIPT5007: プロパティ 'replace' の値を取得できません: オブジェクトは Null または未定義です。

理由はjQueryが .html() で使用する innerHTML が定義されていないためである。
というのもAjaxのデータタイプ（dataType）を"XML"にしているのが原因なので
ちゃんとinnerHTMLが扱えるように"HTML"としてやる必要があるようだ。

JavaScript（修正後）
var conf = null;
$.ajax({{
    url: "./data.xml",
    type: "GET",
    dataType: "html",
    cache: false,
    async: false,
    timeout: 10000,
    success: function(data, textStatus, xhr) {
        conf = $(data).find("conf").html();
    }
});

$.ajaxのdataTypeによるオブジェクトの違いとかをちゃんと理解していないとこうなる。
あらためて勉強しようと思ったのであった。