JQ 常见操作与ajax (二)

8,dom 操作(指的是改变html的标签结构)它有两种情况：
　　1),移动现有标签的位置
　　2),将新创建的标签插入到现有的标签中

　　　　  $('p').parent().next().append($p); /*  标签最后增加一个属性！ */
        $('p').prepend($p)                ;  /*  标签最前增加一个属性！ */
        $('p').parent().before($p)          /*   标签上一个增加一个属性！   */
        $('p').parent().after($p)           /*    标签之后增加一个*/
        $('p').remove()                     /*      删除标签！   */

9,dom 操作的数据不能够执行点击事件的！必须经过上级，不一定父级，进行delegate()  操作！ 这称之为事件委托

　　　　$('ul').delegate('.down', 'click', function () {
                if ($(this).parent().next().length == 0) {
                    alert('已经到底部！');
                    return
                }
                $(this).parent().next().after($(this).parent())
            });

10 ajax 操作(局部刷新操作)      ajax() 方法通过 HTTP 请求加载远程数据。jsonp 能够跨域，也就是可以在一个url 端口下执行其他页面的脚本,采用的的异步，也就是现实生活中的'同步'

　　常见的参数:
　　1、url 请求地址
　　2、type 请求方式，默认是'GET'，常用的还有'POST'
　　3、dataType 设置返回的数据格式，常用的是'json'格式，也可以设置为'html'
　　4、data 设置发送给服务器的数据
　　5、success 设置请求成功后的回调函数
　　6、error 设置请求失败后的回调函数
　　7、async 设置是否异步，默认值是'true'，表示异步

$.ajax({
    // 这三个是必须写的内容！第一个是指url 来源
    url: 'myList.json',
    type: 'get',　　　　　　//指的是请求方式
    dataType: 'jsonp'　　　　//数据类型 jsonp 可以实现跨域的行为！json jsonp 被封装到一个函数之中
    data: {
        //这里是请求数据   GET请求中将附加在URL后，也就是url 之后的数据　　　　　　
    }
})
//如果请求成功 done 写在外面  data.result 表示返回的数据
    .done(function (data) {
        $(data.result).each(function (i) {
            //  data.result[i].word  能够得到每一条数据
            $('ul').append('<li>' + data.result[i].word + '</li>')
        })
    })

    //如果请求失败
    .fail(function () {
        alert('服务器出现问题！')
    })

 11 ,事件冒泡(指的是盒子模型之中)

　当点击里面的元素，会触发外面的点击事件！   return false 阻止父级的元素触发事件！可以通过阻止中间的盒子，来阻止最外面的盒子也触发事件！事件冒泡JQ 封装好的，原生的也可以写。

$('.box').click(function () {
        alert('1');　　　　
        return false   //默认是冒泡的，在这里是阻止冒泡
    });
$('.out').click(function () {
        alert('1.1');
        return false
    });
$('.in').click(function () {
        alert('1.1.1');
        return false
    })