我就是
张龙飞张老二

profession

职业是一个 无产阶级工农 并且是一个 业余金融风投外汇操盘手. 还是一个 灵魂歌手 此外顺带着 敲点代码的前端码农

Image

resume

没啥可说的，该吃吃该睡睡，逍遥又快活，赛过活神仙，下面我给大家吟诗一首：" 君不见黄河之水天上来。 奔流到海不复回。 君不见高堂明镜悲白发。 朝如青丝暮成雪。 人生得意须尽欢。 莫使金樽空对月。 天生我材必有用。 千金散尽还复来。 烹羊宰牛且为乐。 会须一饮三百杯。 岑夫子。 丹丘生。 将进酒 君莫停。 与君歌一曲。 请君为我侧耳听。 钟鼓馔玉不足贵。 但愿长醉不愿醒。 古来圣贤皆寂寞。 惟有饮者留其名。 陈王昔时宴平乐。 斗酒十千恣欢谑。 主人何为言少钱。 径须沽取对君酌。 五花马。 千金裘。 呼儿将出换美酒。 与尔同销万古愁 "

再来一首：" 赵客缦胡缨。 吴钩霜雪明。 银鞍照白马。 飒沓如流星。 十步杀一人。 千里不留行。 事了拂衣去。 深藏身与名。 闲过信陵饮。 脱剑膝前横。 将炙啖朱亥。 持觞劝侯嬴。 三杯吐然诺。 五岳倒为轻。 眼花耳热后。 意气素霓生。 救赵挥金槌。 邯郸先震惊。 千秋二壮士。 煊赫大梁城。 纵死侠骨香。 不惭世上英。 谁能书阁下。 白首太玄经。 " 吟诗，喝酒，醉卧沙场，人生不过一场戏，梦醒云烟散，又何必在意，一花一世界 一叶一菩提，菩提本无树，明镜亦非台，本来无一物，何处惹尘埃。 猫缘很好，08年遇见张三，共度余生，转眼11年，又遇110斤，与子携老。张某人生亦无悔无憾已。

Box skill

SimplePagination Code

SimplePagination: function () {
            function SimplePagination(totalPageCount) {
                if (!totalPageCount)
                    return;
                this.state = {
                    pageNumber: 1,
                    totalPageCount: totalPageCount
                };
            }

            SimplePagination.prototype.init = function (paramsObj) {
                var state = this.state;
                // 页面元素的外部容器
                state.container = paramsObj.container || '.pagination';
                state.totalPageCount = paramsObj.totalPageCount || 10;
                state.pageNumber = paramsObj.pageNumber || 1;
                // 不包括开头和结尾的两个固定按钮外，中间最多展示几个数字页码按钮
                state.maxShowBtnCount = paramsObj.maxShowBtnCount || 3;
                // 所有的页码元素，包括上一页、下一页
                state.pCName = paramsObj.pCName || 'page',
                    // 当选中页码时添加的类名class
                    state.activeCName = paramsObj.activeCName || 'active',
                    // 代表页码数字的属性
                    state.dataNumberAttr = paramsObj.dataNumberAttr || 'data-number',
                    // 上一页 按钮的类名class
                    state.prevCName = paramsObj.prevCName || 'previous',
                    // 下一页 按钮的类名class
                    state.nextCName = paramsObj.nextCName || 'next',
                    // 禁用 上一页 按钮时给此按钮添加的类名class
                    state.disbalePrevCName = paramsObj.disbalePrevCName || 'disabled',
                    // 禁用 下一页 按钮时给此按钮添加的类名class
                    state.disbaleNextCName = paramsObj.disbaleNextCName || 'disabled',
                    // 不包括 上一页 下一页 省略号 按钮的页码元素类名
                    state.pageNumberCName = paramsObj.pageNumberCName || 'page-number';
                // 触发切换页面的事件
                state.swEvent = paramsObj.swEvent || 'click';
                // 切换页面时调用的函数
                state.onPageChange = paramsObj.onPageChange || state.onPageChange;
                // 当需要省略符号占位时，确定 active的位置
                state.totalPageCount > state.maxShowBtnCount + 2 && (state.activePosition = Math.ceil(state.maxShowBtnCount / 2));
                this.renderPageDOM();
            };
            SimplePagination.prototype.switchPage = function () {
                var _this = this;
                var state = this.state;
                var pCNameList = this.selectorEle('.' + state.pCName, true);
                var pageNumber;
                pCNameList.forEach(function (item) {
                    item.addEventListener(state.swEvent, function (e) {
                        var currentPageEle = e.target;
                        if (_this.hasClass(currentPageEle, state.activeCName))
                            return;
                        var dataNumberAttr = currentPageEle.getAttribute(state.dataNumberAttr);

                        if (dataNumberAttr) {
                            // 点击 数字 按钮
                            pageNumber = +dataNumberAttr;
                        }
                        else if (_this.hasClass(currentPageEle, state.prevCName)) {
                            // 点击 上一页 按钮
                            state.pageNumber > 1 && (pageNumber = state.pageNumber - 1);
                        }
                        else if (_this.hasClass(currentPageEle, state.nextCName)) {
                            // 点击 下一页 按钮
                            state.pageNumber < state.totalPageCount && (pageNumber = state.pageNumber + 1);
                        }
                        pageNumber && _this.gotoPage(pageNumber);
                    });
                });
            };
            SimplePagination.prototype.gotoPage = function (pageNumber) {
                var state = this.state;
                var evaNumberLi = this.selectorEle('.' + state.pageNumberCName, true);
                var len = evaNumberLi.length;
                if (!len || this.isIllegal(pageNumber))
                    return;
                // 清除 active 样式
                this.removeClass(this.selectorEle("." + state.pCName + "." + state.activeCName), state.activeCName);
                if (state.activePosition) {
                    var rEllipseSign = state.totalPageCount - (state.maxShowBtnCount - state.activePosition) - 1;
                    // 左边不需要出现省略符号占位
                    if (pageNumber <= state.maxShowBtnCount && (pageNumber < rEllipseSign)) {
                        if (+evaNumberLi[1].getAttribute(state.dataNumberAttr) > 2) {
                            for (var i = 1; i < state.maxShowBtnCount + 1; i++) {
                                evaNumberLi[i].innerText = i + 1;
                                evaNumberLi[i].setAttribute(state.dataNumberAttr, i + 1);
                            }
                        }
                        this.hiddenEllipse('.ellipsis-head');
                        this.hiddenEllipse('.ellipsis-tail', false);
                        this.addClass(evaNumberLi[pageNumber - 1], state.activeCName);
                    }
                    // 两边都需要出现省略符号占位
                    if (pageNumber > state.maxShowBtnCount && pageNumber < rEllipseSign) {
                        // 针对 maxShowBtnCount===1 的特殊处理
                        this.hiddenEllipse('.ellipsis-head', pageNumber === 2 && state.maxShowBtnCount === 1);
                        this.hiddenEllipse('.ellipsis-tail', false);
                        for (var i = 1; i < state.maxShowBtnCount + 1; i++) {
                            evaNumberLi[i].innerText = pageNumber + (i - state.activePosition);
                            evaNumberLi[i].setAttribute(state.dataNumberAttr, pageNumber + (i - state.activePosition));
                        }
                        this.addClass(evaNumberLi[state.activePosition], state.activeCName);
                    }
                    // 右边不需要出现省略符号占位
                    if (pageNumber >= rEllipseSign) {
                        this.hiddenEllipse('.ellipsis-tail');
                        this.hiddenEllipse('.ellipsis-head', false);
                        if (+evaNumberLi[len - 2].getAttribute(state.dataNumberAttr) < state.totalPageCount - 1) {
                            for (var i = 1; i < state.maxShowBtnCount + 1; i++) {
                                evaNumberLi[i].innerText = state.totalPageCount - (state.maxShowBtnCount - i) - 1;
                                evaNumberLi[i].setAttribute(state.dataNumberAttr, state.totalPageCount - (state.maxShowBtnCount - i) - 1);
                            }
                        }
                        this.addClass(evaNumberLi[(state.maxShowBtnCount + 1) - (state.totalPageCount - pageNumber)], state.activeCName);
                    }
                }
                else {
                    // 不需要省略符号占位
                    this.addClass(evaNumberLi[pageNumber - 1], state.activeCName);
                }
                state.pageNumber = pageNumber;
                state.onPageChange && state.onPageChange(state);
                // 判断 上一页 下一页 是否可使用
                this.switchPrevNextAble();
            };
            SimplePagination.prototype.switchPrevNextAble = function () {
                var state = this.state;
                var prevBtn = this.selectorEle('.' + state.prevCName);
                var nextBtn = this.selectorEle('.' + state.nextCName);
                // 当前页已经是第一页，则禁止 上一页 按钮的可用性
                state.pageNumber > 1
                    ? (this.hasClass(prevBtn, state.disbalePrevCName) && this.removeClass(prevBtn, state.disbalePrevCName))
                    : (!this.hasClass(prevBtn, state.disbalePrevCName) && this.addClass(prevBtn, state.disbalePrevCName));
                // 当前页已经是最后一页，则禁止 下一页 按钮的可用性
                state.pageNumber >= state.totalPageCount
                    ? (!this.hasClass(nextBtn, state.disbaleNextCName) && this.addClass(nextBtn, state.disbaleNextCName))
                    : (this.hasClass(nextBtn, state.disbaleNextCName) && this.removeClass(nextBtn, state.disbaleNextCName));
            };
            SimplePagination.prototype.renderPageDOM = function () {
                // 渲染页码DOM
                var state = this.state;
                var pageContainer = this.selectorEle(state.container);
                if (!pageContainer)
                    return;
                var totalPageCount = state.totalPageCount, pCName = state.pCName, prevCName = state.prevCName,
                    disbalePrevCName = state.disbalePrevCName, pageNumberCName = state.pageNumberCName,
                    activeCName = state.activeCName, dataNumberAttr = state.dataNumberAttr,
                    maxShowBtnCount = state.maxShowBtnCount, nextCName = state.nextCName,
                    disbaleNextCName = state.disbaleNextCName;
                var paginationStr = "Prev
                                    1";
                if (totalPageCount - 2 > maxShowBtnCount) {
                    paginationStr += "…";
                    for (var i = 2; i < maxShowBtnCount + 2; i++) {
                        paginationStr += "${i}";
                    }
                    paginationStr += "
                        …
                        ${totalPageCount}
                    ";
                }
                else {
                    for (var i = 2; i <= totalPageCount; i++) {
                        paginationStr += "${i}"
                    }
                }
                paginationStr += "Next"
                pageContainer.innerHTML = paginationStr;
                // 切换页码
                this.switchPage();
            };
            SimplePagination.prototype.isIllegal = function (pageNumber) {
                var state = this.state;
                return (state.pageNumber === pageNumber || Math.ceil(pageNumber) !== pageNumber ||
                    pageNumber > state.totalPageCount || pageNumber < 1 ||
                    typeof pageNumber !== 'number' || pageNumber !== pageNumber);
            };
            SimplePagination.prototype.hiddenEllipse = function (selector, shouldHidden) {
                if (shouldHidden === void 0) {
                    shouldHidden = true;
                }
                this.selectorEle(selector).style.display = shouldHidden ? 'none' : '';
            };
            SimplePagination.prototype.selectorEle = function (selector, all) {
                if (all === void 0) {
                    all = false;
                }
                return all ? document.querySelectorAll(selector) : document.querySelector(selector);
            };
            SimplePagination.prototype.hasClass = function (eleObj, className) {
                return eleObj.classList.contains(className);
            };
            SimplePagination.prototype.addClass = function (eleObj, className) {
                eleObj.classList.add(className);
            };
            SimplePagination.prototype.removeClass = function (eleObj, className) {
                if (this.hasClass(eleObj, className)) {
                    eleObj.classList.remove(className);
                }
            };
            return SimplePagination;

        }(),