Arbitrary [x]html DOM Containers
July 6, 2006 10:57 AM
Is it "standard" for a browser to parse an arbitrary tag as part of the DOM?
I don't know why it never occurred to me before to do this, but for some reason today I was inspired to see whether a browser would apply style rules to a block defined by an arbitrary tag. I created a block that looks like this:
Should it? Why? And if so, would it be a reliable technique? I've never heard of this before.
Bonus question: Am I a sad, sad geek for thinking this is cool?
I don't know why it never occurred to me before to do this, but for some reason today I was inspired to see whether a browser would apply style rules to a block defined by an arbitrary tag. I created a block that looks like this:
<melvin>This is Melvin</melvin>...then I added a style container and applied a style rule to the entity "melvin" (e.g., melvin { background-color: #000000;}). And it worked, in both Safari and Firefox. Seems to work for doctypes all the way from html 4.01 transitional all the way through xhtml 1.1 strict.
Should it? Why? And if so, would it be a reliable technique? I've never heard of this before.
Bonus question: Am I a sad, sad geek for thinking this is cool?
Dammit, I knew that 'x' stood for something.
But seriously, I thought the 'x' in 'xhtml' was just to show lineage from xml. I didn't realize you were actually supposed to be able to define tags.
posted by lodurr at 11:21 AM on July 6, 2006
But seriously, I thought the 'x' in 'xhtml' was just to show lineage from xml. I didn't realize you were actually supposed to be able to define tags.
posted by lodurr at 11:21 AM on July 6, 2006
You're not actually supposed to be able to define tags, but this is how browsers deal with the fact that there is all sorts of crap out there. Your code will not validate and if someone adds a melvin element to XTHML you'll be screwed.
You'd be much better off doing things The Right Way and defining your own XML namespace (<html xmlns="http://www.w3.org/1999/xhtml" xmlns:foo="http://www.example.com/myxhtml_extensions/1.0/">) and putting your tags in there (<foo:melvin>This is Melvin</foo:melvin>).
For more on the exciting world of XML namespacing and XHTML, see Inline XML and the "Custom Attributes" stuff in JavaScript Triggers on A List Apart.
posted by revgeorge at 11:30 AM on July 6, 2006
You'd be much better off doing things The Right Way and defining your own XML namespace (<html xmlns="http://www.w3.org/1999/xhtml" xmlns:foo="http://www.example.com/myxhtml_extensions/1.0/">) and putting your tags in there (<foo:melvin>This is Melvin</foo:melvin>).
For more on the exciting world of XML namespacing and XHTML, see Inline XML and the "Custom Attributes" stuff in JavaScript Triggers on A List Apart.
posted by revgeorge at 11:30 AM on July 6, 2006
Also see Validating a Custom DTD and More About Custom DTDs.
posted by Ptrin at 11:36 AM on July 6, 2006
posted by Ptrin at 11:36 AM on July 6, 2006
This isn't "proper" and it isn't cross-browser. I say this because I want browsers to handle this and put the unknown elements in the DOM, but they're not always obliging.
So what goes wrong?
1) Internet Explorer will not parse unknown elements properly. No sir. It will attempt to figure out what kind of crazy malformed HTML you're throwing at it, so you'll end up with a mess of a DOM tree. It will often fail to even get the overall structure of the tree right, instead inserting closing tags all over the place. And as a bonus, it won't tell you the names of these elements if you navigate through the DOM, though
2) Both IE and Mozilla will uppercase the element names if you inspect the nodeNames, since they're using their HTML parsers. You can avoid this by using the application/xhtml+xml MIME type in Mozilla, but this doesn't work in IE.
I really, really wish the browsers could all just parse these elements without a fuss. I wrote FormFaces, an XForms processor, which looks through an XHTML page and processes the XForms tags in it (stuff like
(If you're curious, said workaround is to grab the raw page source code by doing an
As a side note, Internet Explorer does let you put XML into your page if you use so-called XML data islands. Sticking everything inside
posted by Khalad at 4:26 PM on July 6, 2006
So what goes wrong?
1) Internet Explorer will not parse unknown elements properly. No sir. It will attempt to figure out what kind of crazy malformed HTML you're throwing at it, so you'll end up with a mess of a DOM tree. It will often fail to even get the overall structure of the tree right, instead inserting closing tags all over the place. And as a bonus, it won't tell you the names of these elements if you navigate through the DOM, though
innerHTML will.2) Both IE and Mozilla will uppercase the element names if you inspect the nodeNames, since they're using their HTML parsers. You can avoid this by using the application/xhtml+xml MIME type in Mozilla, but this doesn't work in IE.
I really, really wish the browsers could all just parse these elements without a fuss. I wrote FormFaces, an XForms processor, which looks through an XHTML page and processes the XForms tags in it (stuff like
<xf:input> and <xf:repeat>). But since IE completely mangles these tags in the DOM tree (and Mozilla as well to a lesser extent), I had to use an incredibly painful workaround to get a properly-parsed DOM tree.(If you're curious, said workaround is to grab the raw page source code by doing an
XMLHttpRequest on the page's URL and then feeding the responseText to an XML parser.)As a side note, Internet Explorer does let you put XML into your page if you use so-called XML data islands. Sticking everything inside
<xml> tags probably ruins the fun of having "custom" tags, though.posted by Khalad at 4:26 PM on July 6, 2006
« Older XP Drive maitenance/recovery options | Please help me find a new AntiVirus to replace... Newer »
This thread is closed to new comments.
That said: I am also a Mac user, so I can't test this on IE for you. But IIRC, tags that aren't understood are supposed to be ignored. So while it might not validate, it should be possible to use it and have it degrade gracefully.
posted by spaceman_spiff at 11:15 AM on July 6, 2006