1

我知道自定义元素是非常新的技术。

dom.webcomponents.enabled以下代码在 Webkit 浏览器和 Firefox(带有)中显示不同的内容。

我不明白:为什么添加自定义元素,加载 AJAX,在 Webkit 浏览器中创建 HTMLUnknownElement 而不是自定义元素?这是一个错误吗?Chrome 表示它完全支持自定义元素。相反,Firefox 在标志后面有支持。

这是index.html

<?xml version="1.0" encoding="UTF-8"?>
<html><head></head><body>
<script>
var proto = Object.create(HTMLElement.prototype);
proto.attachedCallback = function() { this.innerHTML = "Custom elements work :-)"; }
var TLoad = document.registerElement('t-load', { prototype: proto });
</script>
<t-load>Custom element are not working :-(</t-load>
<script>
var tload = new TLoad();
tload.appendChild(document.createTextNode('Custom element are not working :-('));
var where = document.querySelector('t-load');
where.parentNode.insertBefore(tload, where);

tload = document.createElement('t-load');
tload.appendChild(document.createTextNode('Custom element are not working :-('));
where.parentNode.insertBefore(tload, where);

var request = new XMLHttpRequest();
request.open('GET', 'loaded.xml', false);
request.send(null);
var result = document.adoptNode(request.responseXML.documentElement);
console.log(result);
where.parentNode.insertBefore(result, where);
</script>
</body></html>

这是loaded.xml

<?xml version="1.0" encoding="UTF-8"?>
<div xmlns="http://www.w3.org/1999/xhtml">
<t-load>Custom element are not working :-(</t-load>
</div>

输出为:(Chrome.Firefox 有其他输出)

Custom elements work :-)Custom elements work :-)
Custom elements are not working :-(
Custom elements work :-)
4

1 回答 1

1

您应该使用importNode而不是adpotNode. 例子:

var result = document.importNode(request.responseXML.documentElement, true);
于 2015-08-13T13:15:04.763 回答