JS核心参考

* 函数

1.arguments[]

//1、argumnets[]只定义在函数体中，本质是一个局部变量，每个函数中都会自动声明并初始化该变量;
//2、callee指代当前正在执行的函数，可以实现递归函数
var k = function (n){
    var actual= arguments.length;  //实际参数个数
    var expected = arguments.callee.length; //期待的参数个数
    console.log(arguments[0]); // 4, 3, 2, 1
    if(n < 2) return n;
    else return n * arguments.callee(n-1);
}
k(4);
k.length; //function的length

2.递归

    //递归函数
    var fn = function(x){
        if(x < 2)
            return 1;
        else
            return x* arguments.callee(x-1);
    };

3.$.load()

       //load传入的第一个参数是字符串，则表示是Ajax方法；传入的是function则是事件处理程序注册方法;
        //后面的#btn1，截取加载好的html中指定选择器的部分；
        $("div").load("test1.html #btn1");

        //第二个参数是字符串，可以追加到url后面，用GET请求
        $("div").load("test1.html", "zidpcode=01233"); //test1.html?zidpcode=01233

        //第二个参数是对象，会发送POST请求，后面的对象会在请求体中提交
        $("div").load("test1.html",{zipcode:0122, units:'F'});

        //第三个参数是回调函数，success、error、timeout

4.触发事件

   $("#btn1").click(function(e){
       // $("#btn2").trigger(e); //触发button2的click事件，与此事件相同的事件
        $("#btn2").trigger("mouseover");  //触发button2的mouseover事件
    });
    $("#btn2").mouseover(function(e){
        console.log(e);
        alert("是由button1触发的");
    });

5.注册多事件

    //可以一次注册多个事件
    $("#btn1").bind({click:function(){
            console.log("click事件");
        }, mouseleave:function(){
            console.log("mouseleave事件");
        }}
    );

    $("#btn1").dblclick(function () {
        //取消事件绑定
        $(this).unbind("mouseleave");
    })

6.定时器

    window.onload = function(){
        //这里的function传入的是方法名
        window.setTimeout("StartTimer()", 1000)
    };

    function StartTimer(){
        $("div").html("timer事件");
    }

7.动画

    //动画，fadeIn淡入
    $("div").fadeIn(500).animate(
        {width:"+=50"},
        {queue:false,duration:1000}
     ).fadeOut(500);

    //animate(); 第一个参数必须是对象，属性名必须是CSS属性名，是动画的目标值
    //动画支持支数值属性， +=增加  -=减少
    //"margin-left" 或者 marginLeft大小写混合
    //可以用"show"、“hide”， "toggle"
    $("div").animate({
        height:0,
        opacity:"-=.1",
        "margin-left": "+=10px",
        borderLeft:"toggle",
    },3000)

8.追加元素

$("body").append("<hr/>append追加"); //在body的最后追加元素
$("h1").prepend("*");   //在h1标签里追加*

//另取一行，在<h1>元素的前后,即在h1标签的外面
$("h1").before("before");
$("h1").after("#")

$("hr").replaceWith("</br>"); //替换

9.阻止冒泡

        var e = $(obj).event || window.event;  //得到当前的事件

    //阻止默认行为（表单提交）
    e.preventDefault();

    //阻止冒泡，
    e.stopPropagation();

    //不断阻止冒泡，而且还阻止对象的后续响应
    e.stopImmediatePropagation();

    e.isDefaultPrevented();
    e.isPropagationStopped();
    e.isImmediatePropagationStopped();

10.页面操作

       var k1 = $("h1").position();
        $("h1").html(); //获取html内容
        $("h1").text(); //获取纯文本内容

        $("h1").addClass(function(n){return "dd"+n;});
        $("h1").removeClass("dd1");
        $("h1").toggleClass("dd2");

        //类检测
        $("h1").hasClass("dd1");
        $("h1").is(".dd1");  //is()比较灵活

        $("input").css({backgroundColor:"yellow", color:"red"});
        $("div").css({border:"1px solid red", width:"100px", height:"60px"});

        $("form").attr("action");
        $("a").removeAttr("target"); //移除属性

        //一次性设置多个属性
        $("img").attr({"src":"icon.gif", width:720, height:360});

        //可以传入函数
        $("a").attr({target:function(){return "_self"; }})

 

11. ajax

        $.ajax({
            type:"POST",
            url: "test1.html",
            cache: false,   //不使用缓存
            async: true,   //false同步，默认true异步
            success :function(result){
                $("body").html(result);
            },failure:function(){
                layer.msg("失败");
            }
        })

12. call和apply

https://blog.csdn.net/ganyingxie123456/article/details/70855586

/*
1. 每个函数都包含两个非继承而来的方法：call()方法和apply()方法。

2. 相同点：这两个方法的作用是一样的。
   都是在特定的作用域中调用函数，等于设置函数体内this对象的值，以扩充函数赖以运行的作用域。
   一般来说，this总是指向调用某个方法的对象，但是使用call()和apply()方法时，就会改变this的指向

3. 不同点：aplly(对象，参数数组)；参数数组必须是有效数组或者arguments对象；
          call(对象，参数)；参数间用逗号隔开
*/

function add(c, d){
    return this.a +this.b + c + d;
}
var o = {a:1, b:2};
add.apply(o, [3, 4]);  //apply传入数组，当前this指向o
add.call(o, 3, 4);  //call传入参数,当前this指向o

 

function log(){
    //实际调用的对象是console，arguments实参
    console.log.apply(console, arguments);
}
log(23, 33);

13. $.extend(p1, p2)

var settings = { validate: false, limit: 5, name: "foo" }; 
var options = { validate: true, name: "bar" };
jQuery.extend(settings, options);  //settings={validate: true, limit: 5, name: "bar"}

14. location.reload() 页面刷新

　　window.location.reload(true); 

15. enter键查询

//回车键 查询
document.onkeydown = function (e) {
    e = e || event;
    var keycode = e.which || e.keyCode;
    if (keycode == 13 && typeof (callurl) == "function") {
        callurl();
    }
};

documnet是window的一个对象，在页面上按回车键可以直接进行查询

转载于:https://www.cnblogs.com/SmileSunday/p/9304018.html