Question

IE似乎会在选项标签上自动添加“已选择”属性但是如果你克隆它，它会变得很奇怪。

如果您使用以下代码在IE8中打开页面：

<html>
<body>
  <form><select><option>o1</option></select></form>
  <script>

      // without clone node
      var elm = document.getElementsByTagName('form')[0];
      alert(elm.innerHTML);

      // using the form as the root to clone
      elm = document.getElementsByTagName('form')[0].cloneNode(true);
      alert(elm.innerHTML);

      // using the select as the root to clone
      elm = document.getElementsByTagName('select')[0].cloneNode(true)
      alert(elm.innerHTML);

  </script>
</body>
</html>

你会得到：

第一个警报，选项标签上有一个可怜的“已选择”属性第二个警报，选项标签没有属性（这没关系，就像在任何其他浏览器中一样！）第三个警报，再次出现“已选中”

知道为什么出现这个属性？
然后为什么cloneNode似乎随机删除它？

注意：您可能会想到为什么这个可怜的家伙有这个问题？原因是我是JS模板库PURE的贡献者我正在努力为这个问题找到一个干净的解决方案： - \

Answer 1

添加所选属性的原因是它是select元素中的第一个选项元素。如果为true且没有其他选项元素已标记为已选中，则IE将选择第一个选项元素。在没有将节点放入dom的情况下克隆节点时，无法选择它。如果您想要一致的结果，只需手动设置所选属性。

IE8：默认情况下，option标签获取“selected”属性（并且cloneNode搞得一团糟）

1 个答案: