javascript - 使用 document.write 与逐个节点生成 dom 时的不同 CSS 继承

标签 javascript html css dom iframe

昨天我发布了一个不同的(相关的)问题: CSS height 100% behaves different when embedded in iframe

这个问题的答案让我将文档类型视为正在发生的事情的潜在原因。然而,我现在开始认为更险恶的事情正在发生。

当逐个节点创建 iframe 并使用

设置文档类型时
document.implementation.createDocumentType("html", "", "")

呈现的内容与使用呈现完全相同的内容不同

document.write("<!DOCTYPE html>")

在这里查看 jsfiddle:https://jsfiddle.net/570qvk2p/3/

在我看来,也许以第一种方式创建的文档类型未被其他 DOM/CSS 以同样的方式尊重。

任何关于这里发生的事情以及我如何解决它的想法都将不胜感激。不幸的是,我的 DOM 必须逐个节点构建,从文档类型开始——我无法改变这个事实。

我基本上是在尝试复制以前渲染过的 DOM 树,而出现这种类型的显示错误显然是我想避免的事情。原始 DOM 呈现的效果与使用 document.write 呈现时的外观相同。

最佳答案

<iframe></iframe>创建文档。由于没有doctype,这里 promise 使用quirks模式。向文档添加 documentType 节点不会更改此 promise 。

你的 document.write()代码吹走了旧文档并创建了一个新文档。写作 <!DOCTYPE html>在开始时将新文档置于标准模式。

关于javascript - 使用 document.write 与逐个节点生成 dom 时的不同 CSS 继承,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40908356/

相关文章:

javascript - bootstrap.min.js 中的意外标记

javascript - jquery $.get 分配给变量的结果在事件监听器中不可用

javascript - 当我在对象数组中键入时,如何查看数组的每个实例中是否存在字符?

javascript - 如何使用 opencv_contrib 构建自定义 opencv.js

php - 为什么 html br 换行标记在此代码中不起作用?

html - 使用 flexbox 垂直对齐文本

javascript - 在没有按钮 ID 的 JavaScript 中单击按钮

javascript - jqplot - 想要限制 y 轴刻度

php - 标题与页面其余部分重叠

html - 根据另一个动态的 div 标签的数据扩展 div 标签