instanceof HTMLElement in IFRAME is not Element or Object?

Question

Trying determinate DOM Element by simple check

isElement = SomeThing instanceof Element

works in main document, but not on (all?) nodes in iframe.

Example output (Google Chrome): (mdiv is DIV in main document, idiv is DIV in iframe)

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]

There are different javascript implementations for main document and for iframe documents ???

Please explain me what's wrong.

Example: (http://www.sbmintegral.sk/GITHUB/OMGWTF/obalka.xhtml)

Code: obalka.xhtml (main document)

<?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>

Code: Dopis.xhtml (inner frame document)

<?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>

Results image (in IE, Chrome, Firefox, Opera)
_{(source: sbmintegral.sk)}

What's "Element"? in DOM level 1, the basicmost of DOM specs from 1998, HTML elements implement the `HTMLElement` interface; there is no, nor has there ever been, an official `Element` interface. With that said, why on earth are you still using XHTML? We got rid of that ages ago. — Mike 'Pomax' Kamermans, Oct 08 '14 at 03:42
Element is constructor of HTMLElement ! Object is constructor of any object, that's why all objects must be instanceof Object. Why XHTML ? ... because HTML has no CDATA XHTML:
<![CDATA[ 1 < 3 < 134 ]]>
HTML :
1 &lt 3 &lt 134
what is cleaner ? If HTML is for lazy peoples which are not able to correctly write XML code, XHTML offers (as XML) many many advantages as f.e. XML islands — supipd, Oct 08 '14 at 06:21
Not sure what you're talking about there: you don't need CDATA in HTML. If you need verbatim code (which most of the time you absolutely do not), you just stick it inside a `` and style it appropriately with CSS. Done: no weird conflicts about `<` needing to be an HTML entity or xml-style cdata escaping. HTML is not "for lazy people", it's simply not XML. It's hypertext markup, which has very different parsing rules. — Mike 'Pomax' Kamermans, Oct 09 '14 at 01:14
Not space to debate. I simple need XML and its powerfull technologies like (XML) SVG, (XML) X3D, XPath searching, XSLT in-browser transformations, XML data islands for Rich Internet Applications ... to dynamically change content according incomming data and user activities ... all without need background server support. After 2 years fighting with problems in HTML, I'm now working with XHTML, and ... I'm happy ... Be too. — supipd, Oct 09 '14 at 05:54
I'm not attacking you on this, if you need XML, you need XML. Your choice of XHTML in a world that moved on to HTML5 is curious, and as data in a question about web programming on a programming help forum, must be questioned to establish whether you're doing something really weird, whether you've inherited ancient code, or whether you simply need XML because of whatever reasons. Welcome to Stackoverflow, where it's our job to question pretty much everything do in your code, to get the most details so people can help. — Mike 'Pomax' Kamermans, Oct 09 '14 at 16:27
according this (http://www.w3.org/TR/2011/WD-html5-20110405/namespaces.html) and this (http://stackoverflow.com/questions/23319537/html-5-inline-svg-and-namespace-awareness-for-svg-dom) is HTML5 namespace http://www.w3.org/1999/xhtml. Xhtml extension of file ensures application/xhtml+xml content-type from server all my code is simply fully HTML5 compliant. Where you see problems ? "HTML5 serialized as XML" is simple one of more namespaced sections in my XML fully compliant documents. — supipd, Oct 10 '14 at 15:19
There is no problem, just an unusual work flow, which was why I asked why you needed XHTML, and you explained yourself. Done. A decision was made by w3c to discontinue XHTML at 1.1, with the idea being that if you have XML, it's just as easy to XSLT to XHTML as it is to XSLT to proper HTML isntead, so the latter is simply preferred for the modern web. You don't *have* to, but it's what most other people/orgs do. The TR link you gave is a draft that talks about the generic namespace links only. That doesn't mean XHTML kept eveolving alongside HTML. It hasn't: it ended with XHTML 1.1 — Mike 'Pomax' Kamermans, Oct 10 '14 at 16:16
Finally ... my provided code is XML compliant HTML5. What most (lazy) people do, does not have to be the best. HTML5 is milestone on a way from XML to XML (machine generated (X)HTML code in RIA editors), attempt (besides another) to fullfill modern needs of direct embedding XML technologies like SVG, MathML into pages with lazy coding (an subsequent complicated parsing) If you really want know, why I use 'XML compliant HTML5' aka XHTML, see at (note XSLT and XML islands) of (http://www.sbmintegral.sk/GITHUB/ajaxslt-0.8.1/test/xslt.xhtml) video: (http://screencast.com/t/knpp8jyQ4tN) — supipd, Oct 10 '14 at 17:44
A propos @Mike'Pomax'Kamermans, if you are working in mozilla team, why firefox interprets instanceof Element distinct from anothers, and which is correct ? — supipd, Oct 10 '14 at 17:52

score 22 · Answer 1 · answered Oct 08 '14 at 07:12

22

There are different javascript implementations for main document and for iframe documents ???

Yes. The iframe has its own environment with its own globals. Try

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

answered Oct 08 '14 at 07:12

Bergi

630,263
148
957
1,375

Oh, it seems clear, but why Firefox said idiv instanceof Element ... true idiv instanceof Object ... false – supipd Oct 08 '14 at 08:01
No idea. Maybe `Element == iwin.Element`? – Bergi Oct 08 '14 at 08:30

instanceof HTMLElement in IFRAME is not Element or Object?

1 Answers1

Linked