make Ox.$ more useful

source/Ox/js/DOM.js

@@ -71,16 +71,18 @@ Ox.element <f> Generic HTML element, mimics jQuery
     > Ox.element("<div>").html("red").html()
     "red"
 @*/
-Ox.$ = Ox.element = function(str) {
+Ox.$ = Ox.element = function(val) {
-    // fixme: add generic bind (remove click and mousedown),
+    // fixme: remove click and mousedown,
     // add native css selector
-    return {
+    // take all matches of getElementsBy...
+    var element = Ox.isObject(val) ? val // window
+        : val[0] == '<' ? document.createElement(Ox.sub(val, 1, -1))
+        : val[0] == '#' ? document.getElementById(Ox.sub(val, 1))
+        : val[0] == '.' ? document.getElementsByClassName(Ox.sub(val, 1))[0]
+        : document.getElementsByTagName(val)[0];
+    return element ? {
         //@ 0 <e> The DOM element itself
-        0: str[0] == '<' ? document.createElement(str.substr(1, str.length - 2)) :
+        0: element,
-            // fixme: why only take the first match?
-            str[0] == '.' ? document.getElementsByClassName(str.substr(1))[0] :
-            str[0] == '#' ? document.getElementById(str.substr(1)) :
-            document.getElementsByTagName(str)[0],
         /*@
         addClass <f> Adds a class name
             (className) -> <o> This element
@@ -137,6 +139,13 @@ Ox.$ = Ox.element = function(str) {
             }
             return ret;
         },
+        bind: function(events) {
+            var that = this;
+            Ox.forEach(Ox.makeObject(arguments), function(callback, event) {
+                that[0]['on' + event] = callback;
+            });
+            return this;
+        },
         /*@
         click <f> Binds a function to the click event
             (callback) -> <o> This element
@@ -167,6 +176,10 @@ Ox.$ = Ox.element = function(str) {
             }
             return ret;
         },
+        empty: function() {
+            this.html('');
+            return this;
+        },
         /*@
         hasClass <f> Returns true if the element has a given class
             (className) -> <b> True if the element has the class
@@ -222,6 +235,10 @@ Ox.$ = Ox.element = function(str) {
                 }
             ).join(' ');
             return this;
+        },
+        unbind: function(event) {
+            delete this[0]['on' + event];
+            return this;
         }
-    }
+    } : null;
 };