Question

来自我正在进行的MSDN thread的Copypasta，并没有真正到达任何地方......

我有一个jQuery的级联下拉插件，它创建了一个包含子进程中每个可过滤的数组，当父进程被更改时，子进程被清除，然后重新添加每个匹配。在任何地方都没有任何问题......直到IE11，它没有保存innerHTML。子正确过滤，因为每个值都会被保留，但文本不会被保留，导致这样：http://i.imgur.com/FVNJybj.png

同样，您可能会注意到寻呼机说有4个项目，但没有显示任何内容。该数据通过AJAX调用加载，构造HTML字符串，然后使用jQuery.html（）插入。我已经输入调试代码来验证IE11实际上是否正确构造了字符串，但是，只有元素实际注入到DOM中。这可以在这里看到：[1]

控制台中选定的行是在插入DOM之前通过console.log（）打印的构造HTML字符串。从我的椅子上看，我认为IE11只是错误地实现HTML控制功能。使用HTML字符串或限定对象时，完全相同的行为是显而易见的。

这是一个系统破解问题。因此，我们的CRM在IE11中无法使用，这是IE6甚至没有问题的功能。 Firefox和Chrome可以预期地按预期工作。

我已经修改过插件，在操作时只使用vanilla JS，但行为保持不变。下面的[2]是一个屏幕截图，演示IE11 实际上是正确过滤，并且在创建初始cascades对象时不存储内部HTML，因为SO不会让我发布我需要的所有链接。

现场演示也包含在下面的评论中。

以前有人见过这个吗？有什么想法吗？

Answer 1

想出来。在IE中，.innerHTML是一个引用调用;在每个其他浏览器中，它返回一个固定值。

Answer 2

我遇到了timeshifter08所描述的类似问题。我做了一个基本的场景，可以很容易地重现这个意想不到的结果。

如前所述，IE11将清空/清除其innerHTML属性设置为''的元素的子节点。事先删除元素的子元素（ren）可能是您可能仍希望执行此操作的可能方法。

与IE11相比，这个小提琴在Chrome和Firefox中产生了不同的结果 https://jsfiddle.net/gv2xqt6d/7/

    <div id="div">
      <span id="span">
        Span
        <p id="p">P</p>
      </span>
    </div>

    ------------------------

    var div = document.querySelector('#div')
    var span = document.querySelector('#span')

    var p = document.querySelector('#p')  

    // div.removeChild(span); // <- Workaround
    div.innerHTML = '';
    div.appendChild(span);

    console.log(span.innerHTML); // Logs nothing in IE11 :(

Answer 3

如果您打算使用innerHTML =''删除子节点；然后使用appendChild插入回去，这在IE11中将不起作用，因为IE11会清除存储在变量中的所有子节点的innerHTML。

例如

<div id="parent">
    <div id="child">
       <div id="grandchild">
       </div>
    </div>
</div>
var child = document.getElementById('child');
var parent = document.getElementById('parent');
parent.innerHTML = ''; // this line will clear the innerHTML of child object
parent.appendChild(child); // will be broken

//以代码内联方式读取注释因此，使用parent.textContent ='';代替

Answer 4

对于IE11，如果要获取子级html内容以进行替换/替换，请使用 textContent 代替 innerHTML 。也是appendChild。

IE11不存储<option> innerHTML </option>

4 个答案: