JQuery

jquery选择器可以快速地选择元素，选择规则和css样式相同，使用length属性判断是否选择成功。

$('#myId') //选择id为myId的网页元素

$('.myClass') // 选择class为myClass的元素

$('li') //选择所有的li元素

$('#ul1 li span') //选择id为为ul1元素下的所有li下的span元素

$('input[name=first]') // 选择name属性等于first的input元素

$('div').has('p'); // 选择包含p元素的div元素

$('div').not('.myClass'); //选择class不等于myClass的div元素

$('div').eq(5); //选择第6个div元素

$('#box').prev(); //选择id是box的元素前面紧挨的同辈元素

$('#box').prevAll(); //选择id是box的元素之前所有的同辈元素

$('#box').next(); //选择id是box的元素后面紧挨的同辈元素

$('#box').nextAll(); //选择id是box的元素后面所有的同辈元素

$('#box').parent(); //选择id是box的元素的父元素

$('#box').children(); //选择id是box的元素的所有子元素

$('#box').siblings(); //选择id是box的元素的同级元素

$('#box').find('.myClass'); //选择id是box的元素内的class等于myClass的元素

$(doctument).ready(function(){

})

$(function(){

})

参数一：要改变的样式属性值，写成字典的形式

参数二：动画持续的时间，单位为毫秒，一般不写单位

参数三：动画曲线，默认为‘swing’，缓冲运动，还可以设置为‘linear’，匀速运动

参数四：动画回调函数，动画完成后执行的匿名函数

``` JavaScript

width:300,

height:300

alert('done!');

   $(function(){
        $('li').each(function(event){
            // each里面形参表示的是each选中的标签的索引值
            // alert(event)
            $(this).html(event)
        })
    })

$(function(){
    var $box1 = $('.father');
    var $box2 = $('.son');
    var $box3 = $('.grandson');
    $box1.click(function() {
        alert('father');
    });
    $box2.click(function() {
        alert('son');
    });
    $box3.click(function(event) {
        alert('grandson');
        event.stopPropagation();

    });
    $(document).click(function(event) {
        alert('grandfather');
    });
})

......

<div class="father">
    <div class="son">
        <div class="grandson"></div>
    </div>
</div>

   $(function(){
        // 追加节点：同级追加 和 子级追加  （前面  后面）
        // 步骤：1、声明变量保存节点数据；2、使用追加函数追加节点
        var $li = $('<li>2222</li>')
        // ul子级追加
        // $li.appendTo($('ul'))  //结尾追加
        // $('ul').append($li)
        // $li.prependTo($('ul'))  // 开头追加
        // $('ul').prepend($li)

        var $div = $('<div>divdiv</div>')
        // $div.insertAfter($('ul'))
        // $('ul').after($div)
        // $div.insertBefore($('ul'))
        // $('ul').before($div)

        // 删除节点
        // $('ul').remove()
        // $('ul').empty()
    })

以前的写法：

$.ajax({
    url: '/change_data',
    type: 'GET',
    dataType: 'json',
    data:{'code':300268}
    success:function(dat){
        alert(dat.name);
    },
    error:function(){
        alert('服务器超时，请重试！');
    }
});

新的写法(推荐)：

$.ajax({
    url: '/change_data',
    type: 'GET',
    dataType: 'json',
    data:{'code':300268}
})
.done(function(dat) {
    alert(dat.name);
})
.fail(function() {
    alert('服务器超时，请重试！');
});

$.ajax的简写方式

$.ajax按照请求方式可以简写成$.get或者$.post方式

$.get("/change_data", {'code':300268},
  function(dat){
    alert(dat.name);
});

$.post("/change_data", {'code':300268},
  function(dat){
    alert(dat.name);
});