-
-
Save Tiller/1009237 to your computer and use it in GitHub Desktop.
| var create = function(e,b,i){ | |
| e=document.createElement(e); // Create the HTML element. e(e) => /body/(/body/) => [body] => body | |
| for(i in b)e[i]=b[i]; // Apply all the gived-attributes | |
| return function(){ // function to append childs | |
| for(i=0;b=arguments[i++];) // lists every childs | |
| e.appendChild(b); // and appends them | |
| return e // then, return the DOM element | |
| } | |
| }; |
| function(e,b,i){e=document.createElement(e);for(i in b)e[i]=b[i];return function(){for(i=0;b=arguments[i++];)e.appendChild(b);return e}} |
| DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE | |
| Version 2, December 2004 | |
| Copyright (C) 2011 YOUR_NAME_HERE <YOUR_URL_HERE> | |
| Everyone is permitted to copy and distribute verbatim or modified | |
| copies of this license document, and changing it is allowed as long | |
| as the name is changed. | |
| DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE | |
| TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION | |
| 0. You just DO WHAT THE FUCK YOU WANT TO. |
| { | |
| "name": "YetAnotherDomBuilder", | |
| "description": "This DomBuilder ALSO builds a dom ! But it ALSO takes attributes in argument §", | |
| "keywords": [ | |
| "dom", | |
| "dombuilder", | |
| "dom builder" | |
| ] | |
| } |
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>AGAIN AND AGAIN AND AGAIN AND AGAIN</title> | |
| </head> | |
| <body> | |
| <div id="ret"></div> | |
| <script> | |
| // write a small example that shows off the API for your example | |
| // and tests it in one fell swoop. | |
| var create = function(e,b,i){e=document.createElement(e);for(i in b)e[i]=b[i];return function(){for(i=0;b=arguments[i++];)e.appendChild(b);return e}}; | |
| document.getElementById("ret").appendChild( | |
| create('DIV', {align: 'center', innerHTML: 'Trololo<br/>'})( | |
| create('UL', {id: 'ul'})( | |
| create('LI', {innerHTML: 'This is the 1st li !'})(), | |
| create('LI')( | |
| create('UL')( | |
| create('LI', {innerHTML: 'A 2nd level li !'})(), | |
| create('LI', {innerHTML: 'And another one !'})() | |
| ) | |
| ) | |
| ), | |
| create('SPAN')(document.createTextNode('Thanks you <3')), | |
| create('div')() | |
| ) | |
| ); | |
| </script> | |
| </body> | |
| </html> |
Why document.createElement(e(e))? Why not just document.createElement(e)?
Because I use regexs, so e return "/body/" and not just "body".
Given a regular expression /foo/, we want the shortest way to convert it to the string "foo".
var e = /foo/;
e.toString() // 12 characters
We can exploit a couple of things:
e.exec()can be invoked by the function call shorthand:e()- Both
exec()andcreateElement()take strings. So whatever is passed into them will be cast to a strings viatoString(). exec()returns an array. The default behaviour of array.toString() is ajoin()with comma as the delimiter. An array with a single item just becomes that item when converted to a string.
So, in essence:
document.createElement(e(e))
Expands to:
document.createElement(e.exec(e.toString()).toString())
With e(e) taking up just 4 characters.
hey @Tiller, would you mind taking the trailing comma out of your package.json keywords?
Done :)
I'm getting an error: "e is not a function" in FireFox 5.0 / Ubuntu.
Yes I know,
From: http://hacks.mozilla.org/2011/06/firefox5/
"Regular expressions are no longer callable as if they were functions; this change has been made in concert with the WebKit team to ensure compatibility (see WebKit bug 28285)."
@atesgoral, what you just explained is pretty neat - but why are regexes used instead of strings?
I changed it for Stings.
Regex are pretty, because in most text editor, the regex'coloration is different from the string'one, so it make the tree more readable :)
e(e)-- OMG!