私はXHTML(XML Http Request)を使用してHTMLフラグメントをロードしています。私はresponseType = "document"を使ってhtml解析をブラウザにオフロードしています。 ajax呼び出しが完了すると、document.adoptNode()を使用してメイン文書にajax html要素を含めています。Safariのdocument.adoptNode()は、ソースドキュメントがquirksモードになっていると、なぜcssクラス名を小文字に変換しますか?
Safariのみに影響する奇妙なバグに気付きました(El CapitanとiOS 9.3.2ではv9.1.1)。 Safariがノードを採用すると、CSSのクラス名が小文字に変換されるようです。完全なデモンストレーションについては、こちらをご覧ください: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、しかし私は間違っていると思っています。