第四章 jQuery文档处理
一、创建元素
1.$("html"); 创建一个DOM元素
2.$("html",props); 创建一个DOM元素，并给予props属性、事件或方法
例:$("<div></div>",{id:"div1",text:"hello",width:80,css:{textAlign:"center"},click:function(){alert("123")}});
二、内部插入
1.$("selector1").append("html"); 在匹配selector元素集合的每个元素末尾插入“html”;
例：$("selector1").append($("h2")); 该方法会将所有的H2标签移动到匹配元素selector元素的末尾。
2.$("selector1").appendTo("selector2"); 将匹配元素selector1插入到selector2元素的末尾。
3.$("selector1").prepend("html"); 在匹配元素selector1元素集合的每个元素开头插入“html”;
4.$("selector1").prependTo("selector2"); 将匹配元素selector1插入到sleector2元素开头。
5.$("selector1").html(["html"]); 设置或获取selector1的html，当不给参数时代表获取html。
6.$("selector1").text(["text"]); 设置或获取selector1的内容，当不给参数代表获取其内容值。
三、外部插入
1.$("selector1").after(content); 该方法是在所有匹配selector1元素集合后面（同级目录）插入centent（html、DOM对象），若content为选择对象，则该方法将会移动该对象。
2.$("selector1").insertAfter("selector2"); 该方法是将元素selector1插入到selector2后面（同级目录）
3.$("selector1").before(content); 该方法是将content插入到匹配元素selector1的前面（同级目录）
4.$("selector1").insertBefore("selector2"); 该方法是将元素selector1插入到selector2前面（同级目录）
四、删除元素
1.$("selector1").remove(); 该方法将会删除匹配selector1的所有元素（不可恢复）。
2.$("selector1").detach(); 该方法将会删除匹配元素，并返回被删除的元素（以便恢复时使用）。
3.$("selector1").empty(); 该方法会清空符合selector1元素集合的所有后代节点，以及其中的任何文本。
五、替换元素
1.$("selector1").replaceWith(newContent); 该方法用于将匹配元素sleector1集合中的所有元素替换为newContent（html、DOM，function[返回html]）。
2.$("selector1").replaceAll("selector2"); 该方法是使用sleector1替换selecotr2与replaceWith目标相反。
六、复制元素
1.$("selector1").clone().appendTo("selecctor2"); 该方法是将selector1复制一份再插入到selector2元素末尾，就避免了移动selecot1。
七、包装元素
1.$("selector1").wrap(html); 该方法是在所有匹配元素selecotor外面包裹一层html。
例：$("div").wrap("<h2></h2>"); 这样就会在所有div外面加一层H2标签。
2.$("selector1").unwrap(); 该方法是删除所有匹配元素的父元素。与wrap的作用相反。
例:$("selector1").wrap("<h2></h2>").unwrap(); 执行后selector会保持不变。
3.$("selector1").wrapAll(html); 该方法也是在selecotr外面包裹一层html与wrap方法不同的是，该方法会将所有匹配selecotr1的元素视为一个整体只包装一次。
4.$("selector1").wrapInner(html); 该方法是在所有匹配元素selecotr1里面内容包裹一层html
例：$("<div id="div1">123</div>").wrapInner(<h2></h2>); 执行结果为"<div id="div1"><h2>123</h2></div>"
八、设置和获取DOM属性
1.$("selecotr1").attr(attrName[，attrvalue]); 该方法将获取selecotor中的attrName属性值，若指定了attrvalue参数则会设置attrName的属性值。
2.$("selector1").removeAttr(attrName); 删除匹配元素的attrName属性。
3.$("selecotor1").val([value]); 设置或获取表单元素的value属性值，若指定了value参数则会设置表单元素selecotor的value值。
九、设置和切换CSS类
1.$("selector1").addClass("className"); 该方法是给所有匹配元素selecotor引用classNmae样式类。
2.$("selector1").hasClass("classNmae"); 该方法用于检测selecotor是否引用了className样式类。
3.$("selector1").removeClass("className"); 该方法用于删除className样式类
4.$("selector1").toggleClass("className"); 该方法作用是判定selecotor1是否拥有className类，若有则删除该类，若没有则添加该类。
十、设置和获取样式属性
1.$("selector1").css("css"); 该方法用于设置或获取selector1的样式属性。
例：$("selector1").css("color"); 获取其color属性值
$("selector1").css({"color":"red","background-color":"yellow"}); 这是其颜色和背景颜色。
十一、设置和获取元素的位置
1.$("selector1").offset(); 获取selector1相对文档的当前坐标，其返回值包含top和left属性对象。
例：$("selector1").offset().top; $("selector1").offset().left; 获取位置
$("selector1").offset({top:100,left:160}); 设置位置
2.$("selector1").position(); 该方法用于获取selector元素相对于父元素的偏移量，其返回值包含top和left属性对象。
3.$("selector1").scrollLeft([value]); 该方法用于获取或这是匹配元素的水平滚动条位置。
4.$("selector1").scrollTop(); 该方法用于获取或设置匹配元素的垂直滚动条位置。
十二、设置和获取元素大小
1.$("selector1").height([value]); 设置或获取元素的高度。(该属性高度不包括：填充、边框、边距)
2.$("selector1").width([value]);
3.$("selector1").innerHeight([value]); 设置或获取元素的内部高度。(该属性高度不包括：边框、边距)
4.$("selector1").innerwidth([value]);
5.$("selector1").outerHeight([bool]); 设置或获取元素的外部高度,参数默认为false表示不包括：边距；若给定参数true则包括：边距
6.$("selector1").outerwidth([bool]);
