代码非常简单，用的时候直接粘贴复制就行。

//dom
J.$package(function(J){
    var doc = document,
    $T = J.type,
    tagNameExpr = /^[\w-]+$/,
    idExpr = /^#([\w-]*)$/,
    classExpr = /^\.([\w-]+)$/,
    selectorEngine;

    var hasClassListProperty = 'classList' in document.documentElement;
    var vendors = ['o', 'ms' ,'moz' ,'webkit'];
    var div = document.createElement('div');

    var $D={

        $:function(selector,context){
            var result;
            var qsa;
            context = context || doc;
            
            //优先使用原始的
            if(idExpr.test(selector)) {
                result = this.id(selector.replace("#",""));
                if(result)  return [result] ;
                else return [] ;
            }
            else if(tagNameExpr.test(selector)){
                result = this.tagName(selector,context);
            }
            else if(classExpr.test(selector)){
                result = this.className(selector.replace(".",""),context);
            }
            // //自定义选择器
            // else if(selectorEngine) result = selectorEngine(selector,context);
            //querySelectorAll
            else result = context.querySelectorAll(selector);
        

            //nodeList转为array
            return J.toArray(result);
                
        },
        id:function(id){
            return doc.getElementById(id);
        },
        tagName:function(tagName,context){
            context=context||doc;
            return context.getElementsByTagName(tagName);
        },
        node:function(name){
            return doc.createElement(name);
        },
        className:function(className,context){
            var children, elements, i, l, classNames;
            context=context||doc;
            if(context.getElementsByClassName){
                return context.getElementsByClassName(className);
            }
            else{
                children = context.getElementsByTagName('*');
                elements = [];
                for(i = 0, l = children.length; i < l; ++i){
                    if(classNames = children[i].className
                        && J.indexOf(classNames.split(' '), className) >= 0){
                        elements.push(children[i]);
                    }
                }
                return elements;
            }
        },
        remove:function(node){
            var context = node.parentNode;
            if(context) context.removeChild(node);
        },
        setSelectorEngine:function(func){
            selectorEngine=func;
        },
        matchesSelector:function(ele,selector){
            if(!ele || !selector) return;
            var matchesSelector = ele.webkitMatchesSelector || ele.mozMatchesSelector || ele.oMatchesSelector || ele.matchesSelector;
            if(matchesSelector) return matchesSelector.call(ele,selector);
            var list = this.$(selector);
            if(J.indexOf(list,ele) > 0) return true;
            return false;
        },
        closest:function(elem,selector){
            while(elem){
                if($D.matchesSelector(elem,selector)){
                    return elem;
                }
                elem = elem.parentNode;
            }
        },
        toDomStyle:function(cssStyle){
            if(!$T.isString(cssStyle)) return;
                return cssStyle.replace(/\-[a-z]/g,function(m) { return m.charAt(1).toUpperCase(); });
        },
        toCssStyle:function(domStyle){
            if(!$T.isString(domStyle)) return;
                  return domStyle.replace(/[A-Z]/g, function(m) { return '-'+m.toLowerCase(); });
        },
        setStyle:function(elem ,styleName,styleValue){
            var self = this;
            if(elem.length){
                J.each(elem ,function(e){
                    self.setStyle(e,styleName,styleValue);
                });
                return;
            }
            if($T.isObject(styleName)){
                for(var n in styleName){
                    if(styleName.hasOwnProperty(n)){
                        elem.style[n] = styleName[n];
                    }
                }
                return;
            }
            if($T.isString(styleName)){
                elem.style[styleName] = styleValue;
            }
        },
        /**
         * 
         * 获取元素的当前实际样式，css 属性需要用驼峰式写法，如：fontFamily
         * 
         * @method getStyle
         * @memberOf dom
         * 
         * @param {Element} el 元素
         * @param {String} styleName css 属性名称
         * @return {String} 返回元素样式
         */
        getStyle: function(el, styleName){
            if(!el){
                return;
            }
            if(styleName === "float"){
                styleName = "cssFloat";
            }
            if(el.style[styleName]){
                return el.style[styleName];
            }else if(window.getComputedStyle){
                return window.getComputedStyle(el, null)[styleName];
            }else if(document.defaultView && document.defaultView.getComputedStyle){
                styleName = styleName.replace(/([/A-Z])/g, "-$1");
                styleName = styleName.toLowerCase();
                var style = document.defaultView.getComputedStyle(el, "");
                return style && style.getPropertyValue(styleName);
            }else if(el.currentStyle){
                return el.currentStyle[styleName];
            }

        },
        //获取带有出产商的属性名
        getVendorPropertyName : function(prop) {
            var style = div.style;
            var _prop;
            if (prop in style) return prop;
            // _prop = prop;
            _prop = prop.charAt(0).toUpperCase() + prop.substr(1);
            for(var i = vendors.length; i--;){
                var v = vendors[i];
                var vendorProp = v + _prop;
                if (vendorProp in style) {
                    return vendorProp;
                }
            }
        },
         //检测是否支持3D属性
         isSupprot3d : function(){
             // var transformStr = $D.getVendorPropertyName("transform");
             // $D.setStyle(div ,transformStr ,"rotatex(90deg)");
             // if(div.style[transformStr] == "") return false;
             // return true;
             var p_prop = $D.getVendorPropertyName("perspective");
             return p_prop && p_prop in div.style;
         },
        filterSelector:function(arr,selector){
            return J.filter(arr,function(elem){
                return $D.matchesSelector(elem,selector);
            });
        },
        addClass: (function(){
            if(hasClassListProperty){//如果有classList属性
                return function (elem, className) {
                    if (!elem || !className || $D.hasClass(elem, className)){
                        return;
                    }
                    elem.classList.add(className);
                };
            }
            else{
                return function(elem, className){
                    if (!elem || !className || $D.hasClass(elem, className)) {
                        return;
                    }
                    elem.className += " "+ className;
                }    
            }
        })(),
        hasClass: (function(){
            if (hasClassListProperty) {
                return function (elem, className) {
                    if (!elem || !className) {
                        return false;
                    }
                    return elem.classList.contains(className);//判断classList是否有className
                };
            } else {
                return function (elem, className) {
                    if (!elem || !className) {
                        return false;
                    }
                    return -1 < (' ' + elem.className + ' ').indexOf(' ' + className + ' ');//通过indexof >-1来判断
                };
            }
        })(),
        removeClass: (function(){
            if (hasClassListProperty) {
                return function (elem, className) {
                    if (!elem || !className || !$D.hasClass(elem, className)) {
                        return;
                    }
                    elem.classList.remove(className);
                };
            } else {
                return function (elem, className) {
                    if (!elem || !className || !$D.hasClass(elem, className)) {
                        return;
                    }
                    elem.className = elem.className.replace(new RegExp('(?:^|\\s)' + className + '(?:\\s|$)'), ' ');//通过正则来把className替换为空
                };
            }
        })(),
        toggleClass:function(ele,className){
            if($D.hasClass(ele,className)){
                $D.removeClass(ele,className);
            }
            else{
                $D.addClass(ele,className);
            }
        },
        // 类似源生方法 `insertBefore`
        insertAfter: function(parentElement, newElement, refernceElement){
            var next = refernceElement.nextSibling;
            if(next){
                parentElement.insertBefore(newElement, next);
            }
            else{
                parentElement.appendChild(newElement);
            }
            return newElement;
        }
    };

    J.dom=$D;
});