element.js 6.14 KB
function node(el) {
    return new element(el);
}

function toArray(lickArr) {
    var arr = [];
    if (lickArr && lickArr.length) {
        for (var i = 0; i < lickArr.length; i++) {
            arr.push(lickArr[i]);
        }
    } else if (lickArr && !lickArr.length) {
        arr.push(lickArr)
    } else {
        throw 'toArray参数格式';
    }
    return arr;
}

function element(el) {
    if (typeof el === 'string') {
        this.el = toArray(document.querySelectorAll(el));
    } else if (el && !Array.isArray(el) && typeof el === 'object') {
        this.el = toArray(el);
    } else if (Array.isArray(el) && el.length) {
        this.el = el;
    } else {
        throw 'init参数格式错误';
    }
    var _this = this;
    this.find = function (sel) {
        var arr = [];
        _this.el.forEach(function (value) {
            arr = arr.concat(toArray(value.querySelectorAll(sel)));
        });
        return node(arr);
    };
    this.attr = function (key, value) {
        if (!arguments[0] || typeof arguments[0] !== 'string') {
            throw 'attr参数格式错误';
        }
        if (arguments[1] && typeof arguments[1] === 'string') {
            _this.el.forEach(function (el) {
                el.setAttribute(key, value);
            });
            return _this;
        } else if (typeof arguments[1] === 'undefined') {
            return _this.el[0].getAttribute(key);
        } else {
            throw 'attr参数格式错误';
        }
    };
    this.hasClass = function (className) {
        if (!className || typeof className !== 'string') {
            throw 'hasClass参数格式错误';
        }
        _this.el.forEach(function (value) {
            if (value.getAttribute('class').indexOf(className) > -1) {
                return true;
            }
        });
        return false;
    };
    this.show = function () {
        _this.el.forEach(function (value) {
            value.style.display = 'block'
        });
        return _this;
    };
    this.hide = function () {
        _this.el.forEach(function (value) {
            value.style.display = 'none'
        });
        return _this;
    };
    this.data = function (key, value) {
        if (!arguments[0] || typeof arguments[0] !== 'string') {
            throw 'data参数格式错误';
        }
        return _this.attr('data-' + key, value);
    };
    this.html = function (html) {
        if (!arguments[0] || typeof arguments[0] !== 'string') {
            throw 'html参数格式错误';
        }
        _this.el.forEach(function (value) {
            value.innerHTML = html;
        });
        return _this;
    };
    this.remove = function () {
        _this.el.forEach(function (value) {
            value.parentNode.removeChild(value)
        });
    };
    this.removeClass = function (className) {
        _this.el.forEach(function (value) {
            value.className = value.className.replace(new RegExp('(\\s|^)' + className + '(\\s|$)'), '');
        });
        return _this;
    };
    this.each = function (callback) {
        if (!callback || typeof callback !== 'function') {
            throw 'each参数格式错误';
        }
        _this.el.forEach(function (el, index, arr) {
            callback && callback(index, el, arr)
        })
    };
    this.clone = function () {
        var arr = [];
        _this.el.forEach(function (value) {
            arr.push(value.cloneNode(true));
        });
        return node(arr);
    };
    this.last = function () {
        return node(_this.el[_this.el.length - 1]);
    };
    this.after = function (html) {
        if (typeof html === 'object' && html.el && html.el.length) {
            html.el.forEach(function (value) {
                for (var i = 0; i < _this.el.length; i++) {
                    _this.el[i].after(value);

                }
            })
        } else {
            for (var i = 0; i < _this.el.length; i++) {
                _this.el[i].after(html + '');
            }
        }
        return _this;
    };
    this.appendTo = function (html) {
        if (typeof html === 'string') {
            var paramEl = toArray(document.querySelectorAll(html));
            paramEl.forEach(function (value, index) {
                for (var i = 0; i < _this.el.length; i++) {
                    if (value !== _this.el[i]) {
                        if (index) {
                            value.appendChild(_this.el[i].cloneNode(true));
                        } else {
                            value.appendChild(_this.el[i]);
                        }
                    }
                }
            })
        } else if (typeof html === 'object' && html.el && html.el.length) {
            html.el.forEach(function (value, index) {
                for (var i = 0; i < _this.el.length; i++) {
                    if (value !== _this.el[i]) {
                        if (index) {
                            value.appendChild(_this.el[i].cloneNode(true));
                        } else {
                            value.appendChild(_this.el[i]);
                        }
                    }
                }
            })
        } else {
            throw '格式错误';
        }
        return _this;
    };
    this.click = function (callback) {
        if (callback && typeof callback === 'function') {
            _this.el.forEach(function (value) {
                value.onclick = callback.bind(value);
            });
            return _this;
        } else if (typeof callback === 'undefined') {
            _this.el.forEach(function (value) {
                value.click();
            });
        } else {
            throw 'click参数错误'
        }
    };
}

function cloneObj(oldObj) { //复制对象方法
    if (typeof oldObj !== 'object') return oldObj;
    if (oldObj == null) return oldObj;
    var newObj = {};
    for (var i in oldObj)
        newObj[i] = cloneObj(oldObj[i]);
    return newObj;
};

node.extend = function () {
    var args = arguments;
    if (args.length < 2) return;
    var temp = cloneObj(args[0]); //调用复制对象方法
    for (var n = 1; n < args.length; n++) {
        for (var i in args[n]) {
            temp[i] = args[n][i];
        }
    }
    return temp;
};

module.exports = node;