JavaScript:XMLSerializer.serializeToString()的替换？

Question

我正在使用Seam框架和RichFaces AJAX库开发一个网站(这些对于手头的问题并不是那么重要 - 只是一些背景).

我似乎在RichFaces中发现了一个错误,在某些情况下,它会导致基于AJAX的更新在IE8中失败(有关详细信息,请参阅此处:http://community.jboss.org/message/585737).

以下是发生异常的代码:

   var anchor = oldnode.parentNode;

   if(!window.opera 
       && !A4J.AJAX.isWebkitBreakingAmps() 
       && oldnode.outerHTML 
       && !oldnode.tagName.match( /(tbody|thead|tfoot|tr|th|td)/i ) ) {
         LOG.debug("Replace content of node by outerHTML()");
         if (!Sarissa._SARISSA_IS_IE || oldnode.tagName.toLowerCase()!="table") {
         try {
           oldnode.innerHTML = "";
         } catch(e){    
           LOG.error("Error to clear node content by innerHTML "+e.message);
           Sarissa.clearChildNodes(oldnode);
         }
       }
           oldnode.outerHTML = new XMLSerializer().serializeToString(newnode);
   }

最后一行(使用XMLSerializer的那一行)是IE中发生异常的地方.我想知道是否有人知道我可以在那里使用的任何替换方法/库/等(仅在IE上很好).谢谢.

编辑:经过一些进一步的研究后,似乎异常不是由XMLSerializer未定义引起的,而是当我尝试将XMLSerializer的输出分配给oldnode的outerHTML属性时.

这很奇怪,因为它大部分时间都有效,但仅在几个场景中失败(这个框架似乎相当重要).

任何人都可以想到什么时候XMLSerializer的输出(从调试器显示的内容看起来是非常有效的HTML)对于元素的outerHTML属性是不可分配的？

最奇怪的是,如果我要克隆元素(使用cloneNode(true))然后设置outerHTML,它似乎工作.

Answer 1

在IE中,您可以简单地使用xmlXML节点的属性,前提newnode是它实际上是XML节点而不是HTML节点:

function serializeXmlNode(xmlNode) {
    if (typeof window.XMLSerializer != "undefined") {
        return (new window.XMLSerializer()).serializeToString(xmlNode);
    } else if (typeof xmlNode.xml != "undefined") {
        return xmlNode.xml;
    }
    return "";
}

oldnode.outerHTML = serializeXmlNode(newnode);

更新问题更新

我不会outerHTML用来替换元素.它并非普遍支持.相反,您可以使用混合innerHTML和标准DOM方法,如下所示:

var tempEl = document.createElement("div");
tempEl.innerHTML = serializeXmlNode(newnode);
oldnode.parentNode.replaceChild(oldnode, tempEl.firstChild);

Answer 2

我已经发现了原因（实际上是不久前）。事实证明，IE 会半验证插入的 HTML（它会阻止某些错误，但忽略其他错误）。它抛出了一些“未知错误”或类似的东西，这几乎完全没有用，因为它没有表明出了什么问题 - 只是出了问题。

就我而言，这是因为 <li /> 与 Parent 一起插入。如果您遇到类似的问题，您可能需要确保自己的 HTML 没有过于聪明。