

Create your own custom HTML tags/component...TODAY - dandonkulous
https://github.com/csuwldcat/WebComponents
Q: What if we could easily extend HTML with tags that do more than just tell Google's crawler about the layout of our content?<p>A: We can, right now, today, on a hell-of-a-lot-of existing browsers and devices: https://github.com/csuwldcat/WebComponents
======
gkoberger
This is actually pretty useful. Basically, it lets you do something like this:

    
    
        document.createElement('slider')
    

Or just write it in HTML like this:

    
    
        <slider></slider>
    

And as soon as the page is about to render it, the script intercepts it and
turns it into something like this (with styles, events, etc):

    
    
        <div class="slider"><div class="slider-knob">O</div></div>
    

You could write a jQuery plugin that does this, however you'd have to
initialize it every time you added the element into the page.

Kind of like a DIY shadow DOM: <http://glazkov.com/2011/01/14/what-the-heck-
is-shadow-dom/>

~~~
dandonkulous
A couple quick, important clarifications:

The parse does not turn the custom tags into divs, there is no need to do
that. These are fully capable, valid tags and exist in the source just the way
you write them: <moz:sometag></moz:sometag>. Check out the demo linked to in
the repo and you'll see ;)

Also, the way the code works is even a bit better than you described in the
dynamic creation case. Let's take your example:

    
    
        var slider = document.createElement('slider');
    

you would actually receive a _fully inflated_ element that is already event-
bound when it is returned out of document.createElement, pretty sweet right?
The innerHTML value of slider would literally read:

    
    
        "<moz:sliderknob></moz:sliderknob>"

