Shorthand JS library, take 2
function $get(input) {
    return document.querySelectorAll(input);
}
function $grab(input) {
    return document.querySelector(input);
}


If I would like to get DOM elements from the page, its overhead to think about having 2 ways to get them and having 2 possible values to deal with. Best if you just deal with sets. If you just need one, it's as simple as the grabbing the set, and get one. No extra code needed.

var justOneDiv = $get('div')[0];


Speaking of sets and array-like objects, querySelectorAll returns a NodeList. It's like an array, but without the array methods. What you could do is to convert the NodeList into a real array. That way, you have instant access to array methods. This could be done with array.slice.



function toArray(arrayLike){
  return Array.prototype.slice.call(arrayLike);
}

function $get(selector){
  return toArray(document.querySelectorAll(selector));
}

// We have instant access to forEach
$get('div').forEach(function(div){
  div.style.color = 'red';  
})

// We can use filter
$get('div').filter(function(div){
  return ~toArray(div.classList).indexOf('bold');
}).forEach(function(div){
  div.style.fontWeight= 'bold';  
});
.red{
  color: red;
}
&lt;div&gt;Red&lt;/div&gt;
&lt;div class="bold"&gt;Red&lt;/div&gt;
&lt;div&gt;Red&lt;/div&gt;




Now we're almost like jQuery but jQuery takes it a bit further. It has the concept of a "jQuery object" which is a custom object that holds the set we're interested in, and has a prototype containing all the methods that operate on that set.

function $(selector){
  if(!(this instanceof $)) return new $(selector);
  this.set = this.find(selector);
}

$.prototype.find = function(selector){/* code that finds elements */};
$.prototype.insert = function(something){/* code that inserts something */};
$.prototype.each = function(callback){ this.set.forEach(callback} };

var div = $('div').each(function(div){/* do something */});


The above is a contrived example of how jQuery works. Adding methods is as easy as adding to the prototype (jQuery exposes it to the world as $.fn). This is how jQuery is so extensible in addition to just exposing one object to the global namespace.

var g = $make('button', {
    style:'float: left',
    class:'myClass',
    text:'Some text here',
    value:'myValue'
});


Still, text is the odd one here. Text are separate nodes, totally different from the element itself. They're essentially "children" of the element and not part of the element. I'd suggest you do something similar to jQuery's text() method. value is different because it is a legit property of some inputs.

Also, all your functions reside in the global scope. You risk clobbering other methods of the same name, or risk yours getting overridden. I suggest you take up just one name in the global scope and nest your methods under it. Mozart would be a good name.

var Mozart = {
  $get: function(){...},
  $remove: function(){...},
  ...
};

var divs = Mozart.get('div');