【嘉兴东臣php】JQuery Dom json Ajax 周总结

      这一周学习了JQuery，jQuery，顾名思义，也就是JavaScript和查询（Query），即是辅助JavaScript开发的库。

一、闭包

      周一学习了闭包。   

1、闭包：其实就是一个函数使用另一个函数的变量。

     闭包特点：

        1、嵌套函数

        2、外部函数的变量可以被内部函数使用。

        3、垃圾回收机制

    闭包优点和缺点

        优点：模块化思想，不会造成全局污染(基本没有全局变量)。

        为什么全局变量会造成污染：

            1、如果变量名重复的话，很容易造成覆盖

            2、从内存的角度上看，全局变量不容易被释放。

        在JS中，变量什么时候被释放？

        1、在JS中，一旦某个函数调用完毕，那么这个函数内部的变量全部被释放。

        2、在JS中，就算某个函数调用完毕，这个全局变量也不见得会被释放，因为可能还有下一个函数。

    闭包的缺点：

        1、最大的缺点就是变量不会被回收！

             因为这个变量，被函数一直使用着。

    匿名函数的写法：(function(){  })();

二、JQuery动画函数

     周二学习了jquery动画函数。

    JQuery : JS 中伟大的框架。使用简单。

   如：<script type="text/javascript" scr="jquery文件"></script>

   注意：使用jquery必须在引用jquery文件后面。

jquery，使用$()来表示对象，有三大选择器

    1、$("#xxx") ID选择器

    2、$(".xxx") Class选择器

    3、$("input") 标签选择器

    4、$("[href='xxxx']") 属性选择器

    几个常用的jquery案例：

    //input 标签点击事件

    $("input").click( function(){    });

动画函数:

    1、show() 显示

    2、hidden() 隐藏 

    3、toggle() 显示和隐藏 

    4、fadeIn() 淡入

    5、fadeOut() 淡出

    6、fadeToggle() 淡入和淡出

    7、slideUp() 向上滑动

    8、slideDown() 向下滑动

   注意：函数里面都可以加入时间参数，单位为毫秒，函数里面都可以加入回调callback参数。

    如：

    show( 1000, function(){

        //回调所执行的函数

    });

    9、animate("执行的动画操作"，时间，可选(回调函数))

    如：

        $("").animate（{"height":"300px;"}, 1500）;

        $("").animate（{"left":"300px;"}, 1500）;   //left：+300px是向右，其余同理

   注意：加入position属性！

  10、stop 停止动画

       参数一：clearQueue:如果设置成true，则清空队列。可以立即结束动画。

       参数二：jumpToEnd:如果设置成true，则完成队列。可以立即完成动画。

        如：stop(true, true);

三、JQuery  Dom

JS Dom：节点、表单、定时器、事件

Jquery Dom:

    节点：

        1、parent() 找到父节点

        2、children()找到子节点       find() 找到被选元素的后代元素

            注意：children 默认不加参数的时候为找第一个节点，加了找参数里的节点。如children("div.select")就是找div里的select的class类

            find，一般用于找子节点的某个元素标签，如：find("div");

        3、next() prev() 找到下一个节点 找到上一个节点

        4、siblings 找到并获取所有的兄弟节点        

        5、eq() 方法返回带有被选元素的指定索引号的元素。

             索引号从 0 开头，所以第一个元素的索引号是 0（不是 1）。

        6、get(索引)匹配元素中的某个索引，注意不返回元素。

        7、first() 通过自定义的找到，找到第一个元素。如：$(".a").first();就是找到class为a的第一个元素。

        8、last() 同上，不过找到的是最后一个元素。

        9、append() 追加HTML内容

        10、appendTo() 把所有匹配的元素追加到另一个指定的元素元素集合中。

        11、remove() 移除，会删除所有匹配到的元素以及文本， 不会占用位置

        12、empty() 清空    会删除所有文本，不会删除匹配到的元素 如：$(this).parent().empty();

        13、attr() 设置属性 、返回属性

        扩展：.css(""属性,"属性值"）设置一个节点的样式

        .html(设置一个节点的HTML代码)   .html() = 返回HTML

        .text(设置一个节点的文本)              .text() = 返回文本

    window.onload 必须等待网页中的所有内容加载完后(包括图片)后才能执行 , 后

   $(document).ready 网页中的所有DOM结构绘制完毕后就执行,可能DOM元素关联的东西并没有加载完 ，先

bind() ,绑定事件。

unbind() 解绑事件。

如：$(".abc").bind("click",function(){

});

$(".abc").unbind();//如果unbind内部没有加入参数的话，移除所有的事件。

$(".abc").unbind("click")//如果unbind内部加了参数的话，移除就是当前参数的事件。

四、JQuery Ajax  

同步：就是在发出一个功能调用时，在没有得到结果之前，该调用就不返回。也就是必须一件一件事做,等前一件做完了才能做下一件事.就像早上起床后,先洗涮,然后才能吃饭,不能在洗涮没有完成时,就开始吃饭.

异步：和同步相对。发出一个异步指令以后，可以不用去管它的执行情况，完成后服务端会自动告诉你结果。

XML为一种数据传输格式： 

    <rows>

        <abc>1</abc>

        <bd>2</bd>

    </rows>

JSON也为一种数据传输格式:

{"row":["abc":1 , "bc":2]}

XML 和 JSON 区别比较参考：http://www.cnblogs.com/SanMaoSpace/p/3139186.html

Jquery Ajax 比原生ajax封装更加良好。

提供了主要四种的解决方法：

1、被选中的Dom.load( "页面",function(内容，状态 ){
    //内容为返回的内容
    //状态：如果成功为Success
})

2、getJson("json文件"，function(内容，状态 ){
    //内容为返回的内容
    //状态：如果成功为Success
})

3、get("url",function(内容，状态){
    //内容为返回的内容
    //状态：如果成功为Success
})

4、post("url",{字典包含的参数}，function(内容，状态){
    //内容为返回的内容
    //状态：如果成功为Success
})

.ajax()

    通过自定义请求方式，请求数据。

    $.ajax({

    url: "http://120.26.196.152/come.php",//URL    

   dataType: "json", //数据格式

   async: true, //是否为异步 

   data: { "name": "ajax","age":"20" },    //参数值

   type: "GET",   //请求方式     

   success: function(req) {//请求成功时处理

            console.log( req );

            $("#message").text( req.name + "-" + req.age );

    },

    error: function(req){ //请求错误的时候的处理

    }

    });

    is() 判断标签 或者 选中的效果
    比如: is('div'), is("input:checked")
    hasClass 一般为判断元素是否有这个类

   比如：hasClass("abc") 判断class里是否有abc这个类

   HTTP STATUS CODE  HTTP协议里的返回状态码。
   200 ：请求成功
   302 ：请求被跳转
   404 ：页面找不到，请求错误
   403 ：该访问请求没有权限
   500 ：服务器程序错误

   这周所学让我受益匪浅，在练习方面我虽然经历思考却很少能写出来，结果并不好，但是重要的是要有前进的意志，就像贪吃蛇一样，为了食物而前进，就算吃不到食物，只要有了这种向真实前进的意志，即使这次失败了，我也终于会达到目标的，因为我仍在继续前进，这是不会错的。

转载于:https://my.oschina.net/u/2545468/blog/552062