javascript - 为什么当源文档处于怪癖模式时，Safari 的 document.adoptNode() 会将 css 类名转换为小写？

Question

我正在使用 XHR(XML Http 请求)加载 html 片段。我正在使用 responseType = "document"以将 html 解析卸载到浏览器。当 ajax 调用完成时，我使用 document.adoptNode() 将 ajax html 元素包含在我的主文档中。

我注意到一个奇怪的错误，它只影响 Safari(El Capitan 上的 v9.1.1 和 iOS 9.3.2)。好像Safari在采用节点的时候，会将css类名转成小写。有关完整演示，请参阅此 jsfiddle:https://jsfiddle.net/theblueslate/wxo7zst5/2/

此错误不会出现在 Chrome v51 或 IE11 上。

jsfiddle 中的代码包含在此处:

function buildDataLoadedCallback (containerId, useAdopt) {
    return function() {
        var parsedDoc = this.response;
        var parsedBodyChild = parsedDoc.body.children[0];

        var newNode;

        if (useAdopt) {
            newNode = document.adoptNode(parsedBodyChild);
        } else {
            newNode = document.importNode(parsedBodyChild, true);
        }
        var container = document.getElementById(containerId);
        container.appendChild(newNode);
    }

}

function requestAjaxHtmlFragment(pageName, callback) {
    var xhr = new XMLHttpRequest();
    xhr.responseType = "document";
    xhr.addEventListener("load", callback);

    /* this fragment.html file simply contains:
    <div class="myClass">
    <p>MyClass</p>
    </div>
    */
    xhr.open("GET","https://dl.dropboxusercontent.com/u/15211879/js-fiddle/" + pageName + ".html", /*async:*/true);

    xhr.send();
}

var pageName =  "fragment";

requestAjaxHtmlFragment(pageName, buildDataLoadedCallback(pageName + "-adopt-container", true));

是否有我遗漏的明显错误？我无法发现它，我提出了一个 webkit 错误:https://bugs.webkit.org/show_bug.cgi?id=159555 ，但我希望我错了。

Answer 1

事实证明这是一个错误。现在已在 WebKit 中修复:https://bugs.webkit.org/show_bug.cgi?id=159555

我认为将其发布到 SO 仍然有用。像我一样，发帖可以提高其他正在努力解决这个问题的人的知名度。