JavaScript学习八 jquery学习2

其他的一些选择方法：

表单数据的获取（挺好使）：

$(:input)
只能匹配Input元素类型为input button select textarea

$(:text)
匹配所有的单行文本框

$(:password)
匹配所有的密码框

$(:radio)
匹配所有的单选按钮

$(:checkbox)
匹配所有的复选框

$(:submit)
匹配所有的提交按钮

$(:image)
匹配所有的图像域，例如<input type="image" />

$(:reset)
匹配所有的重置按钮

$(:button)匹配所有的按钮

$(:file)
匹配所有的文件上传域

$(:hidden)
匹配所有的不可见元素或者type为hidden的元素

$(:enabled)
匹配所有可用的input元素，比如radio:enabled表示匹配所有可用的单选按钮

$(:disabled)
匹配所有的不可用input元素，作用与上相反

$(:checked)
匹配所有选中的复选框元素

在这：通过方法进行匹配：

（1）匹配指定类型的第几个：

$("input").eq(1).val("KwooJan");

（2）指定类型中有没有class属性为“xx”的：

$("input").hasClass("blue")

（3）查找某个元素的父元素：

$("input:first[class='red']").parent().is("body"));

（4）排除指定条件的标签：

$("p:first").not("b");

（5）进行map操作：

	$("p:first").text($("input").map(function() {
		return $(this).val();
	}).get().join(", "));

（6）取出某类组件的值，并赋值给另一个组件：

$("p:first").text(
		$("input").<span style="background-color: rgb(192, 192, 192);">map(
				function() {
		                  return $(this).val();}
			      ).get().join(",")//map操作</span>
	);

（7）选择第几个（选取子集的位置）：

$("p").slice(2,4).fadeIn(3000);//slice（起始，终止）终止的不包括在内

（8）连接不同的元素之中的数据：

$("p").add("b").text();

（9）查找某个元素的子元素：

$("#aa").children().css("background", "#C9F");

（10）获得子元素

$("p").contents().text("表示获得某个元素的子元素内容").css("background", "#C9F");

（11）查找某个元素下面的子元素：

$("p").find("B").text("表示搜索某个元素下面的某个子元素").css("background", "#FC0");});

（12）获得同层的此元素后面的其他元素的集合：

$("p").<span style="background-color: rgb(192, 192, 192);">next("#h")</span>.text("我是p下的h1的内容");});

（13）同上，不过是后面所有的：

$("#aa .bb").nextAll().css("background", "red");

（14）获得选定元素的父元素：

$("#3 ,#CC").parent().css("background", "#CF9")

（15）匹配元素之前所有的同辈元素：

$("#dv8 #3").prevAll().css("background", "green");

（16）同上，单个匹配：

$("#aa #CC").prev().css("background", "red");

（17）查找当前元素之前所有的同辈元素

$("#aa #DD").siblings().css("color", "red");

（18）添加自身：

$("div").find("p").<span style="background-color: rgb(153, 153, 153);">andSelf().</span>addClass("red"); 

（19）选取所有的p元素，查找并选取span子元素，然后再回过来选取p元素

$("p").find("span").end().html("<h1>woshi</h1>");