文档串联处理

• 破坏性操作，增，删，换都是破坏性操作

1. end：返回上一次破坏型操作之前的元素集合

$("outer").find(".inner").hide().show(200).end();//#outer

2. add：新增任何集合，返回的就是一个新集合

console.log($("#outer").add("<span>dshfds</span>")); //返回的是[#outer,span],这个为什么不能显示在页面上

3. addBack：当前集合加上上一次破坏型操作之前的集合,形成大集合

$("#third").nextAll().addBack().css("background-color","hotpink"); //3后面所有的div背景色变成枚红色

• attr()：设置或返回被选元素的属性值，属性值返回的cssText样式。
• prop()：与attr一样
• attr一般获取标签属性,返回一个样式的cssText
• prop设置属性

$("input[type=radio]").prop("disabled","disabled"); //为radio增加disabled

$("#outer").attr("id"); //#outer
     $(".inner").attr("class") //.inner abcde
     $(".inner").eq(4).attr("class") //.inner
     $("img").attr({ src: "test.jpg", alt: "Test Image" });//为img添加src属性和alt属性
     $("#outer").attr({"class":"abc","name":"bcd"});
     //为attr添加class和name

5. removeAttr():移除属性
   removeProp():移除属性

$("input[type=radio]").removeProp("disabled","disabled");

$("#third").removeAttr("class"); //移除class属性
     $("#outer").removeAttr("class name"); //删除class和name，以空格分隔，一次传入对个属性名

CSS类的操作

1. addClass（class,fn（index,class））在原有的上面追加class值,接收两个参数

$("#outer").first().addClass("inner");//为div下的第一个添加class属性，first（），包括其自身

2. removeClass()：从匹配的元素中删除class属性

$("#third").removeClass("inner");

3. toggleClass():如果有这个class，就去掉，如果没有就增加,折叠和伸缩效果,互斥效果

$("#outer div").toggleClass("inner");

(this).next().toggleClass("hide");
}); //实现伸缩效果

HTML代码/文本/值

1. html([val|fn])：获取文本内容和html标签

$("#third").html(); //3
$("#outer").html();//所有的子集元素

2. text（[val|fn]）:返回对应元素的innerText

$("outer").text();//""
$("#third").text();//
"3"

3. val():获取value值

$("input[type=submit]").val();//"提交"
$("select").val();
//"上海"

$(callback)和window.onload的了解

1.功能：当一段事件代码出现在控制台能执行，在页面中不能执行的时候，一定是事件触发的的时候，dom或者资源还没加载出来。此时这两者都是为了解决这个问题的。
2.区别：

• Windows.onload是dom0级事件，只能绑定一个有效的监听函数，后面的会覆盖前面的，而$(callback) 可以绑定多个
• window.onload等待图片css等资源全部加载完毕才会触发。而(callback)会快window.onload
• 一般写在head部分

window.onload=function(){
    $(".inner").click(function(){
        $(this).css("transform","scale(1.5,1.5)");
    });
    };

    $(function(){
    $(".inner").click(function(){
        $(this).css("border-radius","50%");
    });
    });

    $(function(){
    $(".inner").click(function(){
        $(this).css("background-color","#eee"); //js里面整数位可以省略
    });
    });

html和css

<div id="outer">
    <span></span>
    <diV></diV>
    <div class="inner abcde">1</div> <!-- 加一个空的class -->
    <div class="inner">2</div>
    <div class="inner" id="third">3</div>
    <div class="inner">4</div>
    <div class="inner"></div>
    <div class="inner">6</div>
    <div class="inner">7</div>
    <div class="inner">8</div>  
    <div class="inner">9</div>
</div>
<script type="text/javascript" src="../day10/js/jquery-1.11.2.js"></script>
    <style type="text/css">
        #outer{height: 200px;border:1px solid #ccc;display: flex;}
        .inner{width: 100px;height: 100px;background-color:pink;font-size: 32px;line-height: 100px;text-align: center;margin:auto;transition:transform 1s;}
        .hide{display: none;}
    </style>

jauqry中的ajax是一个属性名

• jsonp,是一种js请求，不是ajax。也是可以请求同源数据，主要是跨域请求
• ajax函数支持jsonp请求，只不过不是ajax请求，jauqry中的ajax是一个属性名
• ajax函数支持jsonp请求，只不过不是ajax请求，jauqry中的ajax是一个属性名
  $.ajax参数
• 第一个参数是URL，如果第一个参数不是字符串，会自己认为在当前内部第二个数，封装成对象，以键值对传入

$.ajax({
    url:"data.json",//url
        type:"post",//请求方式
        data:{name:"张三",age:28},//上送数据
        async:true, //同步异步
        headers:{key:"111"}, //设置请求头中的属性，设置在报文头部中，也可以在函数中动态添加
        dataType:"jsonp" ,//数据类型，改成jsonp
        
        beforeSend:function(xhr){  //发送前执行函数,参数是通信对象
            //写信后悔了，xhr.abort();撤销当次请求，通常在beforsend中设置
            xhr.abort(); //经常用于设置请求头setRequestHeader
            console.log(xhr); //readyState为0 ,因为这不是源生js，是包装过的，没有
            xhr.setRequestHeader("key2",2222);
        },
        success:function(data,textState,jqXHR){ //请求成功执行该函数，包括数据返回，格式标准
            console.log(data); //返回数据中文对象
            console.log(textState);//通信状态success(与)
            console.log(jqXHR);//
        },
        error:function(XMLHttpRequest, textStatus, errorThrown){ //请求异常时执行该函数，能拦住错误的都是try和catch.这是源生的框架
            console.log(data); //返回数据中文对象
            console.log(textState);//通信状态success(与)
            console.log(jqXHR);//
        },
        complete:function(){ //无论请求完成最后执行的函数，无论是否请求成功，都会执行里面的函数
            console.log(111)；
        }
    });

• 方便修改传参方式

$.ajaxSetup({
     url:"data.json",//url
        type:"post",//请求方式
        data:{name:"张三",age:28},//上送数据
        async:true, //同步异步
        headers:{key:"111"}, 设置请求头中的属性，设置在报文头部中，也可以在函数中动态添加
        dataType:"json" ,//数据类型
     });//初始化

iquery事件

1. bind ,绑定事件
2. delegate委托 ，少用
3. on