Javascript Internet Explorer中的样式表属性是如何工作的？

我已经找到了解决我所遇到问题的办法。但我不太明白它为什么有效。 以下是在IE5-IE10中发生的情况，IE11中的样式表属性被sheet替换

var foo = document.createElement("style");
foo.type = "text/css";
console.log(foo.styleSheet);

上面的代码将记录一个样式表对象

var bar = document.createElement("link");
bar.rel = "stylesheet";
bar.type = "text/css";
bar.href = "styles.css";
console.log(bar.styleSheet);

此代码记录为null

所以我的问题是，为什么我可以访问新创建的样式元素的样式表属性，而不能访问新创建的链接元素

一些说明和意见：

当我在IE开发者工具中检查bar变量时，我可以清楚地看到bar.styleSheet实际上不是空的。我可以看到样式表对象的所有属性

type=text/css实际上不需要将任何一个元素视为样式表。如果排除此项，您仍然可以在开发人员工具中看到这两个项目的样式表对象。如果将元素附加到文档中，将读取并应用样式规则。唯一的区别是，如果不为新创建的样式元素（如foo）设置type=text/css，那么 样式表属性将为空

如果在bar上运行for in循环，并尝试在循环内或循环后访问bar.styleSheet属性，则它不再为null，并且以某种方式神奇地变成了样式表对象

正如预期的那样，当您将bar添加到文档的头部时，您将能够访问bar.styleSheet属性

最后一个注释还提出了一个附带问题，即为什么在将foo元素插入文档之前能够访问foo的样式表属性？我这样问是因为根据微软在

样式表对象仅在包含在带有样式或链接元素的文档中时才可用于样式表

我没有在代码中将foo附加到文档中，那么为什么我可以访问它的样式表对象呢

我不是在寻找解决方案，而是要解释为什么新创建的元素会以这种方式运行

---

提前谢谢。

这是一把小提琴，在Mac FF上都返回未定义。在我的Win7虚拟机中，即11，两个都返回未定义。您使用哪个浏览器获取结果？它适用于IE 5到IE 10。我肯定console.log在IE8中不起作用，所以我不确定您是如何让它返回nullTry警报的。我正在使用IE 11并在开发者工具中更改文档模式。似乎样式标签已经在头部，而链接标签在使用IE开发者工具检查后没有出现