jQuery之DOM

样式操作

i.设置css()

	jquery对象.css("属性名","属性值");
	jquery对象.css({ "属性名":"属性值"      ,"属性名":"属性值" ,...,"属性名":"属性值"     });

ii.追加或移除样式class

	addClass("x");
	addClass("x x x");
	removeClass(x);
	removeClass(x x );
	removeClass():移除全部样式
	toggleClass("x x x"):切换追加与移除

内容操作

	html()：获取值 ，获取的是元素 的内容 ，包含了 元素内部的 各种标签
	html(xxxx) :先渲染，后显示

	text()：：获取值 ，值获取文本值
	text(xxxx)：將值原样显示，没有渲染

	val()：获取value值
	val(xxx)：设置value值

节点与属性操作

i.节点操作

①查询节点 （jquery选择器）

②创建节点 ： $()

	$(选择器):获取节点		
	$(DOM对象)：转换
	$(html字符串)，   $("<li onclick="..">xxx</li>")

③插入节点 文档

内部插入 ：

	$(A).append(B)	将B追加到A中    		  如：$("ul").append($node);
	$(A).appendTo(B)	把A追加到B中			如：$ node.appendTo("ul");
	$(A). prepend (B)	将B前置插入到A中		如：$("ul"). prepend ($node);
	$(A). prependTo (B)	将A前置插入到B中		如：$ node.prependTo ("ul");

外部插入

$(A).after(B)	将B插入到A之后				如：$("ul").after($node);
$(A).insertAfter(B)	将A插入到B之后			如：$ node.insertAfter("ul");
$(A).before(B)	将B插入至A之前				如：$("ul").before($node);
$(A).insertBefore(B)	将A插入到B之前		如：$ node.insertBefore("ul");

④替换节点

	$X.replaceWith($Y)	：用$Y替换$X	
	replaceAll();

⑤删除节点

	remove()：彻底删除
	detach()：将结点删除，但关联的事件、数据不会删除（不推荐使用）
	empty()	：只删除内容

⑥克隆节点

			clone(true|false)
			$(document).ready(function(){     
				$("li").click(function(){  ... });
			});			

			  <li>xxxx</li>

属性操作

	attr("属性名") ：获取属性值
	attr("属性名","属性值") ：设置属性值
	attr({ "属性名":"属性值",    "属性名":"属性值" ,  "属性名":"属性值" } );
	
	removeAttr("属性名");  删除属性值

获取集合与遍历集合

①子节点集合

	 $(...).children( "li")
	后代集合(不推荐使用，影响性能)
	 $(...).find( "li")

②同辈集合

	next()：后一个  +
	prev(): 前一个
	siblings()：同辈，左、右

③前辈

	parent():父代
	parents("ul"):祖先

过滤集合：

	i.很多方法的()就是一个过滤选择器
	ii.filter("选择器...");  

遍历集合：

	$(...).each(function(index,element){
	
	});

CSS-dom操作:

	height(500) ;
	width(500);

	
	
	offset()：偏移量（左上角的点）,left top
	offset(function(n,oldOffset){   ... })


	offsetParent()：获取  （已定位）的最近的祖先元素
		已定位：元素position属性(默认static)被设置为了relative  absolute  或fixed  

	scrollLet()
	scrollTop()