2

简而言之，使用 Dojo 框架的脚本最终会在 IE 上得到不同的结果。

这是一个演示该问题的示例页面：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.7.3/dojo/dojo.js"></script>
<script type="text/javascript">

dojo.connect(document.body, "onload", function () {

    var d = dojo.query("div");
    var s = dojo.query("span");
    dojo.empty(d[0]);
    dojo.create("span", {innerHTML: s[0].innerHTML}, d[0]);

});

</script>
</head>
<body>
<div><span>foobar</span></div>
</body>
</html>

不要费心在 jsFiddle 上尝试，这种特殊情况不会在那里重现。

样本应该输出foobar，但在 IE 上却没有。

为什么会发生这种情况，有没有办法解决它？

4

1 回答 1

2

经过一些挖掘和调试后，我设法将问题追溯到 Dojo 的内部：

397.empty = has("ie") ? function(node) {
    node = dom.byId(node);
    for (var c; c = node.lastChild; ) {
        _397.destroy(c);
    }
} : function(node) {
    dom.byId(node).innerHTML = "";
};

_397.destroy = function destroy(node) {
    node = dom.byId(node);
    try {
        var doc = node.ownerDocument;
        if (!_3a2 || _3a3 != doc) {
            _3a2 = doc.createElement("div");
            _3a3 = doc;
        }
        _3a2.appendChild(node.parentNode ? node.parentNode.removeChild(node) : node);
        _3a2.innerHTML = "";
    } catch (e) {
    }
};

从上面的代码可以看出，IE 有一个特殊情况，但不幸的是它在功能上并不等同——事情最终会有所不同。

不确定这是否是一个错误，但肯定是一个值得怀疑的功能。一种解决方法是dojo.clone()在innerHTML调用之前运行dojo.empty()：

var d = dojo.query("div");
var s = dojo.query("span");
var i = dojo.clone(s[0].innerHTML);
dojo.empty(d[0]);
dojo.create("span", {innerHTML: i}, d[0]);
于 2012-11-27T11:10:38.260 回答