1.jQuery 属性操作 （常用有三种：prop() / attr() / data() ）

    1）元素固有属性 prop()

        元素固有属性:就是元素本身自带的属性。

          ·获取属性： prop("属性名");

        ·设置属性： prop("属性名"，"属性值");

    2）元素自定义属性 attr()
       
        ·获取属性： attr("属性名"); // 类似原生 getAttribute()

        ·设置属性： attr("属性名"，"属性值");  // setAttribute()

    也可以获取 H5 自定义属性（data-）

    3）数据缓存 data()

    ★ data()方法：可以在指定的元素上存取数据，并不会修改 DOM 元素结构。一

旦页面刷新，之前存放的数据都将被移除。

        ·附加数据：data("name","value");          //向被选取的元素附加数据

        ·获取数据：data("name");         // 向被选取的元素 获取数据
   
    同时，还可以读取 HTML5 自定义属性  data-index ，得到的是数字型。

2.jQuery 文本属性值

    ★ jQuery的文本属性值常见操作有三种：html() / text() / val();
       
    ★ 分别对应JS中的 innerHTML 、innerText 和 value 属性。       

    1）普通元素内容 html()

        html()                         // 获取元素的内容

        html("内容")                // 设置（改变）元素的内容
       
    2）普通元素文本内容 text()

        text()                        // 获取元素的文本内容

        text("文本内容")                // 设置元素的文本内容

    3）表单的值 val()

        val()                         // 获取表单的值

        val("内容")                // 设置表单的值

★ 注意：html() 可识别标签，text() 不识别标签。

3.jQuery 元素操作

    ★ 主要是用jQuery方法，操作标签的遍历、创建、添加、删除等操作。

    1）遍历元素 each()（想要给同一类元素做不同操作，就需要用到遍历）

            而jQuery 隐式迭代是对同一类元素做了同样的操作。
       
             1】语法一：$("div").each( function (index,domEle) {} );       

        ·each()方法 遍历匹配的每一个元素。

        ·里面的回调函数的2个参数：

                index 是每个元素的索引号；

                domEle 是每个DOM元素对象，不是jQuery对象。       

        ★ 使用jQuery方法，需要给 dom元素转换为jQuery对象,$(domEle)
                       
        2】语法二：$.each( object,function( index,element) {} );

        ·$.each()方法用于遍历任何对象，主要用于数据处理，如数组,对象

        $.each({
                name: "andy",
                age: 18
            }, function(i, ele) {
                console.log(i); // 输出的是 name age 属性名
                console.log(ele); // 输出的是 andy  18 属性值
            })
        })

    2）创建元素（动态创建）

        var li = $("<li></li>");

    3）添加元素（内部添加、外部添加）

        内部添加：$("ul").append(li);  // 放在 匹配元素内部的最后面

                 $("ul").prepend(li); // 放在 匹配元素内部的最前面
               
        外部添加：// 把内容放入目标元素后面

                 $("ul").after($("<div></div>"));

                 // 把内容放入目标元素前面

                 $("ul").before($("<div></div>"));

    ★ 注意：内部添加元素，生成之后，它们是父子关系；
            外部添加元素，生成之后，它们是兄弟关系。

    4）删除元素

        $("div").remove()        //删除匹配到的元素（本身）

        $("ul").empty()                //删除匹配到的元素中的所有子节点
       
        $("div").html("")        //清空 div元素的内容

★ 注意：以上只是元素的创建、添加、删除方法的常用方法，其他方法请参详API。

4. jQuery 尺寸、位置操作

    1）jQuery 尺寸操作

        // 1.取得匹配元素宽度和高度值,只算width/height

               width()/height();

        // 2.取得匹配元素宽度和高度值 包含padding

        innerWidth()/innerHeight();

        // 3.取得匹配元素宽度和高度值 包含padding、border

        outerWidth()/outerHeight();

        // 4.取得匹配元素宽度和高度值 包含padding、border、margin

        outerWidth(true)/outerHeight(true);

★ 注意：1】以上参数为空，则是获取相对应的值。
        2】如果参数为数字（可以不必写单位），则是修改相对应的值。

    2）jQuery 位置

        // 1.offset()设置或获取元素偏移 （可获取，可设置）

        offset()方法，是相对于文档的偏移坐标，跟父级没有关系

        offset().top        获取距离文档顶部的距离
        offset().left        获取距离文档左侧的距离

        设置元素的偏移：offset( { top:10,left:30 });

        // 2.position()获取元素偏移 （只能获取，不能设置）
       
        position()方法，是相对于带有定位的父级元素的偏移坐标

        position().top        获取距离文档顶部的距离
        position().left        获取距离文档左侧的距离

        // 3.scrollTop()/scrollLeft()设置或获取元素被卷去的头部、左侧
        不跟参数是获取，括号里跟参数是设置（不代单位）




       

1.jQuery 属性操作 （常用有三种：prop() / attr() / data() ）

    1）元素固有属性 prop()

        元素固有属性:就是元素本身自带的属性。

          ·获取属性： prop("属性名");

        ·设置属性： prop("属性名"，"属性值");

    2）元素自定义属性 attr()
       
        ·获取属性： attr("属性名"); // 类似原生 getAttribute()

        ·设置属性： attr("属性名"，"属性值");  // setAttribute()

    也可以获取 H5 自定义属性（data-）

    3）数据缓存 data()

    ★ data()方法：可以在指定的元素上存取数据，并不会修改 DOM 元素结构。一

旦页面刷新，之前存放的数据都将被移除。

        ·附加数据：data("name","value");          //向被选取的元素附加数据

        ·获取数据：data("name");         // 向被选取的元素 获取数据
   
    同时，还可以读取 HTML5 自定义属性  data-index ，得到的是数字型。

2.jQuery 文本属性值

    ★ jQuery的文本属性值常见操作有三种：html() / text() / val();
       
    ★ 分别对应JS中的 innerHTML 、innerText 和 value 属性。       

    1）普通元素内容 html()

        html()                         // 获取元素的内容

        html("内容")                // 设置（改变）元素的内容
       
    2）普通元素文本内容 text()

        text()                        // 获取元素的文本内容

        text("文本内容")                // 设置元素的文本内容

    3）表单的值 val()

        val()                         // 获取表单的值

        val("内容")                // 设置表单的值

★ 注意：html() 可识别标签，text() 不识别标签。

3.jQuery 元素操作

    ★ 主要是用jQuery方法，操作标签的遍历、创建、添加、删除等操作。

    1）遍历元素 each()（想要给同一类元素做不同操作，就需要用到遍历）

            而jQuery 隐式迭代是对同一类元素做了同样的操作。
       
             1】语法一：$("div").each( function (index,domEle) {} );       

        ·each()方法 遍历匹配的每一个元素。

        ·里面的回调函数的2个参数：

                index 是每个元素的索引号；

                domEle 是每个DOM元素对象，不是jQuery对象。       

        ★ 使用jQuery方法，需要给 dom元素转换为jQuery对象,$(domEle)
                       
        2】语法二：$.each( object,function( index,element) {} );

        ·$.each()方法用于遍历任何对象，主要用于数据处理，如数组,对象

        $.each({
                name: "andy",
                age: 18
            }, function(i, ele) {
                console.log(i); // 输出的是 name age 属性名
                console.log(ele); // 输出的是 andy  18 属性值
            })
        })

    2）创建元素（动态创建）

        var li = $("<li></li>");

    3）添加元素（内部添加、外部添加）

        内部添加：$("ul").append(li);  // 放在 匹配元素内部的最后面

                 $("ul").prepend(li); // 放在 匹配元素内部的最前面
               
        外部添加：// 把内容放入目标元素后面

                 $("ul").after($("<div></div>"));

                 // 把内容放入目标元素前面

                 $("ul").before($("<div></div>"));

    ★ 注意：内部添加元素，生成之后，它们是父子关系；
            外部添加元素，生成之后，它们是兄弟关系。

    4）删除元素

        $("div").remove()        //删除匹配到的元素（本身）

        $("ul").empty()                //删除匹配到的元素中的所有子节点
       
        $("div").html("")        //清空 div元素的内容

★ 注意：以上只是元素的创建、添加、删除方法的常用方法，其他方法请参详API。

4. jQuery 尺寸、位置操作

    1）jQuery 尺寸操作

        // 1.取得匹配元素宽度和高度值,只算width/height

               width()/height();

        // 2.取得匹配元素宽度和高度值 包含padding

        innerWidth()/innerHeight();

        // 3.取得匹配元素宽度和高度值 包含padding、border

        outerWidth()/outerHeight();

        // 4.取得匹配元素宽度和高度值 包含padding、border、margin

        outerWidth(true)/outerHeight(true);

★ 注意：1】以上参数为空，则是获取相对应的值。
        2】如果参数为数字（可以不必写单位），则是修改相对应的值。

    2）jQuery 位置

        // 1.offset()设置或获取元素偏移 （可获取，可设置）

        offset()方法，是相对于文档的偏移坐标，跟父级没有关系

        offset().top        获取距离文档顶部的距离
        offset().left        获取距离文档左侧的距离

        设置元素的偏移：offset( { top:10,left:30 });

        // 2.position()获取元素偏移 （只能获取，不能设置）
       
        position()方法，是相对于带有定位的父级元素的偏移坐标

        position().top        获取距离文档顶部的距离
        position().left        获取距离文档左侧的距离

        // 3.scrollTop()/scrollLeft()设置或获取元素被卷去的头部、左侧
        不跟参数是获取，括号里跟参数是设置（不代单位）