迷之分类 – 第 2 页

js 模拟jq 实现 $ 选择器

(function(){
    var jQ = function(selector, father){
        return new jQ.prototype.init(selector);
    };
    jQ.prototype = {
        length:0,
        init:function(selector, father){
            var _document = father || ja.view,
                classInt = 0,
                res = this;
            if (typeof selector != "string" || !selector ){
                if(typeof selector == "object" && selector.hasOwnProperty("length")){
                    for(var i = 0 ; i < selector.length ; i++){
                        this[classInt] = selector[i];
                        classInt++;
                    }
                }else{
                    this[classInt] = selector;
                    classInt++;
                }

            }else{
                var props = selector.trim().split(" "),
                    selector = props.shift(),
                    selectLast = props.join(" "),
                    mark = selector.charAt(0);
                if(mark == "["){
                    var selector=selector.replace(/[\[\]]/g,""),
                        arr = selector.split("=");
                    key = arr.length > 1 ? arr[0].trim() : "name",
                        val = arr.length > 1 ? arr[1].trim() : arr[0].trim();
                    //遍历children
                    // ja.log(key,val);
                    _document.children.map(function(ele){
                        return (function(father,deep){
                            // var res = [];
                            if(typeof father[key] !="undefined" && father[key] == val){

                                this[classInt] = father;
                                classInt++;
                            }
                            var c = father.children;
                            if(c && deep < 5){
                                deep++;
                                for(var i in c){
                                    arguments.callee.call(this,c[i],deep);
                                }
                            }
                            // return res;
                        }).call(this,ele,0);
                    }.bind(this))
                }else if(mark == "."){
                    var res = this.__class(selector.substring(1));
                    res.map(function(ele){
                        this[classInt] = ele;
                        classInt++;
                    }.bind(this));

                }
            }
            this.length = classInt;
            return this;
        },
        /*原型方法，不暴露*/
        //类选择器位置列表
        __class:function(className){
            var arr = [];
            switch (className){
                case "mainView":
                    arr.push(ja.view);
                    break;
                case "setBalance":
                    arr.push(ja.setb);
                    break;
                case "gameBalance":
                    arr.push( ja.gameb);
                    break;
                case "playerFrameList":
                    for(var key in ja.view.playerInfoHandler.playerFrameList){
                        arr.push(ja.view.playerInfoHandler.playerFrameList[key].view);
                    }
                    break;
                case "playerArea":
                    arr.push( ja.view.posLocal2Player);
                    break;
                case "playerOut":
                    ja.view.posLocal2Player.map(function(ele){
                        arr.push( ele.outTile);
                    });
                    break;
                default:
                    return null
            }
            return arr;
        },
        //通过选择器确定子元素获取方式
        _selector: function(selector, father){
            if(typeof selector != "string" || !selector){
                return this;
            }
            father = father ? father.children : Array.prototype.slice.apply(this);
            var mark = selector.charAt(0);
            switch(mark){
                case "[":
                    var reg = /\[(([\w\W]+)=["']?([\w\W]+)["']?|([\w\W]+))\]/;
                    var reg_res = reg.exec(selector);
                    var res_key = reg_res[2] || "name";
                    var res_val = reg_res[3] || reg_res[4];
                    var res = [];
                    father.map(function(ele){
                        return (function(fa, deep){

                            if(typeof fa[res_key] != "undefined" && fa[res_key] == res_val){
                                res.push(fa);
                            }

                            if (fa.children.length > 0 && deep < 5){
                                deep++;
                                for( var i = 0 ; i < fa.children.length ; i++){
                                    var add = arguments.callee.call(this,fa.children[i],deep);
                                }
                            }
                            return res;
                        }).call(this,ele,0);
                    }.bind(this));

                    return res;
                case ":":

                    break;
                case "*":

                    break;
                default:

            }
        },
        //表达式筛选器，未完成
        _expression:function(expression){
            if(!expression){

            }
            switch (expression){
                case "first":
                    return 0;
                case "last":
                    return
            }
        },
        /*过滤*/
        find:function(selector){
            var res = this._selector(selector);
            return new jQ.prototype.init(res);
        },
        parent:function(){
            var arr = [];
            Array.prototype.slice.apply(this).map(function(ele,ind){
                arr.push(ele["parent"]);
            }.bind(this));
            if(arr.length > 0){
                var res = arr.length == 1 ? arr.shift() : arr;
                return new jQ.prototype.init(res);
            }
        },
        parents:function(){

        },
        child:function(selector){

        },
        /*操作*/
        attr:function(selector, setValue){
            var arr = [];
            Array.prototype.slice.apply(this).map(function(ele,ind){
                if(typeof setValue == "undefined"){
                    if(typeof ele[selector] != "undefined"){
                        arr.push(ele[selector]) ;
                    }else if(typeof ele["_"+selector] != "undefined"){
                        arr.push(ele["_"+selector]) ;
                    }

                }else{
                    ele[selector] = setValue;
                }
            }.bind(this));
            if(arr.length > 0){
                return arr.length == 1 ? arr.shift() : arr;
            }
        },
        hide:function(){
            Array.prototype.slice.apply(this).map(function(ele){
                ele.setVisible(false);
            })
        },
        show:function(){
            Array.prototype.slice.apply(this).map(function(ele){
                ele.setVisible(true);
            })
        },
    };
    jQ.prototype.init.prototype = jQ.prototype;
    return window.$ = jQ;
})()

js 模拟类，继承

var initializing = false, fnTest = /xyz/.test(function() { xyz; }) ? /\b_super\b/ : /.*/;
    //构造基类
    this.jaClass = function() {};
    jaClass.extend = function(props){
        var _super = this.prototype;
        initializing = true;
        var prototype = new this();
        initializing = false;

        for (var name in props){
            //这一段是赋值到prototype中，运用三元运算符的方式很灵活
            //满足函数的条件作为函数插入到prototype中
            prototype[name] = typeof props[name] =="function" &&
            typeof _super[name] == "function" && fnTest.test(props[name]) ?
                (function(name, fn) {
                    return function(){
                        var tmp = this._super;
                        this._super = _super[name];
                        var ret = fn.apply(this, arguments);
                        this._super = tmp;
                        return ret;
                    };
                })(name, props[name]) :
                props[name]
        }

        function Class(){
            if(!initializing && this.ctor)
                this.ctor.apply(this, arguments);
        }

        //子类prototype指向父类的实例，继承的关键
        Class.prototype = prototype ;
        Class.prototype.constructor = Class;
        //子类自动获得extend方法，arguments.callee 指向当前正在执行的函数
        Class.extend = arguments.callee;
        return Class;
    };

js url get参数转码解码

     var target = encodeURI('中文字'); //url转码
   var afterConvert = decodeURI('%E7%BE%8E%E5%9B%A2%E7%BD%91'); //结果："美团网"  url解密

thinkphp 跨域

    public function _initialize() {
    header ( "Content-type:text/html;charset=utf-8" );
    header ( "Access-Control-Allow-Origin:*" ); // 允许任何访问(包括ajax跨域)

  }

Bootstrap nav hover 导航栏划过激活

//让 hover 可以触发dropdown
    $("#header .nav .dropdown").on("mouseover", function() {
          if ($(this).is(".open")) {
              return;
          }
          $(this).find("> a").dropdown("toggle");
      })
    $("#header .nav .dropdown").on("mouseout", function() {
          $(this).removeClass("open");
      })

jq 插件化巨坑 loading 拷贝副本替换法

点哪个哪个显示加载

//调用
$(even).mini_load();//显示加载
$(even).mini_loaded();//回到原来的样子


$.fn.extend({
    mini_load:function(msg,color){
        var msg=(typeof(msg)=="undefined")?"操作中...":msg;
        var that=$(this);
        var that_copy=$(that).clone();
        var color=(typeof(color)=="undefined")?"white":"black";
        var img_load=document.createElement("span")
        img_load.className="span_loading";
        that_copy.attr("copy","loadingcopy");
        that_copy.html(msg);
        that_copy.prepend(img_load);
        $(that_copy).removeAttr("onclick");
        that.hide();
        that.after(that_copy);
    },
    mini_loaded:function(){
        var that=$(this);
        that.show();
        that.siblings("[copy='loadingcopy']").remove();
    }
})

css

.span_loading{
  background: url(../images/loading-white.gif);
  width:20px;
  height: 20px;
  display: inline-block;
  background-size: 100%;
  vertical-align:middle;
}

【js】二位数组排序sort

var arr = [[1, 2, 3], [7, 2, 3], [3, 2, 3]];
arr.sort(function(x, y){
  //return x[key].localeCompare(y[key]);//中文可以用这个
  return x[0] – y[0];
});

mate自适应页面

原文地址：孤独大兔子

<meta name=”viewport” content=”” />

在content属性中主要包括以下属性值，用来处理可视区域。

viewport 语法介绍：
01      <!-- html document -->
02      <meta name="viewport"
03          content="
04          height = [pixel_value | device-height] ,
05          width = [pixel_value | device-width ] ,
06          initial-scale = float_value ,
07          minimum-scale = float_value ,
08          maximum-scale = float_value ,
09          user-scalable = [yes | no] ,
10          target-densitydpi = [dpi_value | device-dpi | high-dpi | medium-dpi | low-dpi]
11          "
12      />

width
控制 viewport 的大小，可以指定的一个值或者特殊的值，如 device-width 为设备的宽度（单位为缩放为 100% 时的 CSS 的像素）。

height
和 width 相对应，指定高度。

target-densitydpi
一个屏幕像素密度是由屏幕分辨率决定的，通常定义为每英寸点的数量（dpi）。Android支持三种屏幕像素密度：低像素密度，中像素密度，高像素密度。一个低像素密度的屏幕每英寸上的像素点更少，而一个高像素密度的屏幕每英寸上的像素点更多。Android Browser和WebView默认屏幕为中像素密度。下面是 target-densitydpi 属性的取值范围

device-dpi –使用设备原本的 dpi 作为目标 dp。不会发生默认缩放。
high-dpi – 使用hdpi 作为目标 dpi。中等像素密度和低像素密度设备相应缩小。
medium-dpi – 使用mdpi作为目标 dpi。高像素密度设备相应放大，像素密度设备相应缩小。这是默认的target density.
low-dpi -使用mdpi作为目标 dpi。中等像素密度和高像素密度设备相应放大。
<value> – 指定一个具体的dpi 值作为target dpi. 这个值的范围必须在70–400之间。

1 ???? 
2 ???? <meta name="viewport" content="target-densitydpi=device-dpi" />
3 ???? <meta name="viewport" content="target-densitydpi=high-dpi" />
4 ???? <meta name="viewport" content="target-densitydpi=medium-dpi" />
5 ???? <meta name="viewport" content="target-densitydpi=low-dpi" />
6 ???? <meta name="viewport" content="target-densitydpi=200" />

为了防止Android Browser和WebView 根据不同屏幕的像素密度对你的页面进行缩放，你可以将viewport的target-densitydpi 设置为 device-dpi。当你这么做了，页面将不会缩放。相反，页面会根据当前屏幕的像素密度进行展示。在这种情形下，你还需要将viewport的width定义为与设备的width匹配，这样你的页面就可以和屏幕相适应。

initial-scale
初始缩放。即页面初始缩放程度。这是一个浮点值，是页面大小的一个乘数。例如，如果你设置初始缩放为“1.0”，那么，web页面在展现的时候就会以target density分辨率的1:1来展现。如果你设置为“2.0”，那么这个页面就会放大为2倍。

maximum-scale
最大缩放。即允许的最大缩放程度。这也是一个浮点值，用以指出页面大小与屏幕大小相比的最大乘数。例如，如果你将这个值设置为“2.0”，那么这个页面与target size相比，最多能放大2倍。

user-scalable
用户调整缩放。即用户是否能改变页面缩放程度。如果设置为yes则是允许用户对其进行改变，反之为no。默认值是yes。如果你将其设置为no，那么minimum-scale 和 maximum-scale都将被忽略，因为根本不可能缩放。所有的缩放值都必须在0.01–10的范围之内。

例：

(设置屏幕宽度为设备宽度，禁止用户手动调整缩放)
<meta name="viewport" content="width=device-width,user-scalable=no" />

(设置屏幕密度为高频，中频，低频自动缩放，禁止用户手动调整缩放)
<meta name="viewport" content="width=device-width,target-densitydpi=high-dpi,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>

世界，您好！

欢迎使用WordPress。这是您的第一篇文章。编辑或删除它，然后开始写作吧！

分类：迷之分类