0

Here is a simple fiddle: 

alert(document.doctype.valueOf())

It produces [object DocumentType], as expected.

However, when I hit F12 and just type document.doctype.valueOf() in the JavaScript console (Chrome, IE11), I see:

<!DOCTYPE html>

Why is the discrepancy, and what property (if any) does it actually show in the console mode?

[UPDATE] When I mentioned that document.doctype.outerHTML used to work until IE11 in the comments to @BlueSkies's answer, I was not quite correct. In my case, I host a WinForms version of IE WebBrowser control in a C# app. I've just discovered it works like this, in IE11 too:

dynamic domDocument = webBrowser.Document.DomDocument;

// this shows '<!DOCTYPE html PUBLIC "" "">'
string doctype = domDocument.doctype.outerHTML;
MessageBox.Show(doctype); 

// this shows 'undefined'
domDocument.parentWindow.execScript("alert(document.doctype.outerHTML)");

Apparently, it works from outside, but not from inside the page. Interesting, but unreliable. I guess I should not use document.doctype.outerHTML even in this IE-based app.

Community
  • 1
  • 1
noseratio
  • 59,932
  • 34
  • 208
  • 486
  • The console shows `name`, `publicId` and `systemId` properties of `document.doctype`. – Teemu Nov 09 '13 at 10:56
  • @Teemu, so the console gives a kind of special treatment to `document.doctype` object? – noseratio Nov 09 '13 at 11:06
  • In a way, yes. But the same is done with the most of the logged objects. `document.doctype` is just a regular host object provided by a browser. – Teemu Nov 09 '13 at 11:34

1 Answers1

3

The .valueOf() returns neither output. What it returns is the actual node.

So the alert() is giving you the .toString() of the node, and the Chrome/IE consoles have simply decided to serialize the node to HTML.

document.doctype.valueOf() === document.doctype; // true

Here's a little experiment...

document.doctype.toString = function() { return "foobar"; }

alert(document.doctype.valueOf());  // shows "foobar"
Blue Skies
  • 2,935
  • 16
  • 19
  • Hmm.. can you serialize this node to HTML with JavaScript, **just the same way the console does**, without resorting to a technique like this: http://stackoverflow.com/a/10162353 ? That's my point about the difference. – noseratio Nov 09 '13 at 01:19
  • @Noseratio: No, to my knowledge there's no built in method to do this. The console probably uses some code similar to that answer. I don't believe `.inner/outerHTML` can give you the markup. The console is an addon. There's no specification that defines its behavior. – Blue Skies Nov 09 '13 at 01:22
  • For IE, `document.doctype.outerHTML` used to work until IE11. Also, while `.valueOf()` indeed returns the actual node in this case, **that does not apply to every object**: http://msdn.microsoft.com/en-us/library/ie/ftx8swz5(v=vs.94).aspx – noseratio Nov 09 '13 at 01:25
  • For Objects that are a box for a primitive value, it returns the primitive. Otherwise it returns the object. And don't forget that DOM nodes are host objects. They're not required to obey all the rules of native ECMAScript objects. Maybe the DOM spec or HTML5 spec defines `.valueOf()` for DOM nodes. Not sure. – Blue Skies Nov 09 '13 at 01:29
  • Thanks, I'll let the question to hang on for a little longer before accepting your answer, just to see if there any other ideas. – noseratio Nov 09 '13 at 01:32