在IFRAME中，instanceof HTMLElement不是Element或Object吗？

Question

在IFRAME中，instanceof HTMLElement不是Element或Object吗？

16

通过简单检查尝试确定DOM元素

isElement = SomeThing instanceof Element

主文档中可以正常工作，但在 iframe 中（所有？）节点上无法正常工作。

示例输出（谷歌浏览器）：（mdiv 是主文档中的 DIV，idiv 是 iframe 中的 DIV）

OMGWTF 
ok:  mdiv instanceof Element ... true ... [object HTMLDivElement]
ok:  mdiv instanceof Object ... true ... [object HTMLDivElement]
ko:  idiv instanceof Element ... false ... [object HTMLDivElement]
KO :  idiv instanceof Object ... false ... [object HTMLDivElement]

主文档和iframe文档有不同的javascript实现吗？请解释一下是什么问题。

例如：(http://www.sbmintegral.sk/GITHUB/OMGWTF/obalka.xhtml)

代码：obalka.xhtml (主文档)

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
   <title>Obalka</title>
  </head>
  <body>
    <div id="auto_filled_commands_container">
MAIN div id="auto_filled_commands_container"<br/>
        <iframe id="auto_filled_commands_iframe" src='dopis.xhtml' style="width:98%;height:98%;"/>
    </div>
<div>
<textarea id="OMGWTF" style="width:700px;height:200px">
mdiv = document.getElementById("auto_filled_commands_container");
ifram = document.getElementById("auto_filled_commands_iframe");
idiv = ifram.contentDocument.getElementById('auto_filled_commands');
OMGWTF = "OMGWTF \n"
+"ok:  mdiv instanceof Element ... "+(mdiv instanceof Element)+" ... "+mdiv+"\n"
+"ok:  mdiv instanceof Object ... "+(mdiv instanceof Object)+" ... "+mdiv+"\n"
+"ko:  idiv instanceof Element ... "+(idiv instanceof Element)+" ... "+idiv+"\n"
+"KO :  idiv instanceof Object ... "+(idiv instanceof Object)+" ... "+idiv+"\n"
;
document.getElementById('result_txta').value = OMGWTF;
</textarea>
<br/><input type="button" value="Eval code in upper textarea (to bypass possible developer tools error)" onclick="
    eval(document.getElementById('OMGWTF').value);
"/><b>(2.)</b><br/>
<textarea id="result_txta" style="width:700px;height:100px">
</textarea>
</div>
  </body>
</html>

代码：Dopis.xhtml（内部框架文档）

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
   <title>Dopis</title>
  </head>
  <body>
    <div id="auto_filled_commands">
IFRAME div id="auto_filled_commands"<br/>
        <div id="afc_formular">
IFRAME div id="afc_formular"<br/>
<input id="cmnd" type="text" value="input id='cmnd'" />
<br/><input type="button" value="Click to get browser userAgent" onclick="
    var preEl = this.ownerDocument.getElementById('navUserAgent');
    var cdataEl = preEl.firstChild || preEl;    /* IE don't know CDATA ?! */
    cdataEl.textContent=navigator.userAgent;
"/><b>(1.)</b>
<pre id="navUserAgent"><![CDATA[
]]></pre>
        </div>
    </div>
  </body>
</html>

结果图像（在IE，Chrome，Firefox，Opera中）
_{(来源：sbmintegral.sk)}

- supipd

元素是HTMLElement的构造函数！ - supipd

不确定你在说什么：在HTML中不需要使用CDATA。如果您需要原样代码（大多数情况下绝对不需要），只需将其放入<textarea>中，并使用CSS适当地进行样式设置。完成：没有关于<需要成为HTML实体或xml样式cdata转义的奇怪冲突。HTML不是“懒人用的”，它只是不是XML。它是超文本标记语言，具有非常不同的解析规则。 - Mike 'Pomax' Kamermans

没有讨论的空间。我只需要 XML 及其强大的技术，如 (XML) SVG、(XML) X3D、XPath 搜索、浏览器中的 XSLT 转换、用于 Rich Internet 应用程序的 XML 数据岛等，以根据传入数据和用户活动动态更改内容，而无需后台服务器支持。在与 HTML 的问题斗争了两年之后，我现在正在使用 XHTML，并且...我很高兴...你也应该这样做。 - supipd

根据以下内容(http://www.w3.org/TR/2011/WD-html5-20110405/namespaces.html)和这个(https://dev59.com/OGAg5IYBdhLWcg3wrMh4)，HTML5命名空间是http://www.w3.org/1999/xhtml。文件的XHTML扩展确保了来自服务器的application/xhtml+xml内容类型，我的所有代码都完全符合HTML5标准。你在哪里看到问题了？"HTML5序列化为XML"只是我完全符合XML规范的文档中更多命名空间部分之一。 - supipd

没有问题，只是一个不寻常的工作流程，这就是为什么我问你为什么需要XHTML，而你解释了自己。完成了。W3C做出了决定，在1.1版中停止使用XHTML，其想法是如果您有XML，那么将XML转换为XHTML与将XML转换为适当的HTML一样容易，因此后者在现代Web上更受欢迎。您不必这样做，但大多数其他人/组织都这样做。您提供的TR链接是一个草案，仅涉及通用命名空间链接。这并不意味着XHTML随着HTML一起不断发展。它没有：它以XHTML 1.1结束。 - Mike 'Pomax' Kamermans

显示剩余7条评论

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Bergi · Accepted Answer

主文档和iframe文档有不同的javascript实现吗？

是的。iframe具有其自己的环境和全局变量。尝试一下：

var iwin = ifram.contentWindow;
idiv instanceof iwin.HTMLElement; // true
idiv instanceof iwin.Object; // true