jQuery Tips(5)－－－－关于伪类选择符

第一个：<input　type="input"　/>　
第二个：<select　id="select">　
　
</select>　
第三个：<textarea></textarea>　
<script　type="text/javascript">　
　　alert($(":input").length);//alert　3　
</script>

可以看到，不光<input>被选择，<select>和<textarea>也被选择了

伪类选择符可以嵌套

通常情况下，我们可以通过嵌套伪类选择符来达到我们需要的效果,伪类选择符，如下：

　　<ul>　
　　<li>1</li>　
　　<li>2</li>　
　　<li>3</li>　
　　<li>4</li>　
　　<li>5</li>　
　　<li>6</li>　
　　<li>7</li>　
　　</ul>　
　
　　<script　type="text/javascript">　
　　　　$("li:not(:first):not(:last)").css("background-color",　"blue");　
　　</script>

效果:

可见，除了第一个和最后一个li,其它都被选择.当然，嵌套是有层数限制的，具体的次数我就不太清了(各位高手记得麻烦告诉我下),反正够你进行不是变态的使用:-)

自定义伪类选择符

jquery还提供给我们扩展原有选择符的方式，可以让我们根据自己的需要自定义选择符，下面通过一个有实际意义的例子看如何做到：

在我们使用jquery的serialize方法将当前表单中的元素提交到服务器时，总是会选上asp.net的ViewState(<input type=”hidden” />)这无疑浪费了好多资源，我们通过一个扩展的伪类选择符看如何不选择它:

<form　name="form1"　method="post"　action="default.aspx"　id="form1">　
<div>　
<input　type="hidden"　name="__VIEWSTATE"　id="__VIEWSTATE"　value="/wEPDwUJNzgzNDMwNTMzZGRWxo4mg/noF3+7k/L7nyw13HVnLQ=="　/>　
</div>　
　
　
　　<script　type="text/javascript">　
　　　　$.expr[":"].noViewState　=　function(element)　{　
　　　　　　return　!$(element).attr("id")　===　"_VIEWSTATE";　
　　　　}　
　　　　alert($(":input:noViewState").size());//alert　0　ViewState　has　not　been　choosen　
　　</script>　
　
　　</form>

通过$.expr的方式对伪类选择符进行扩展，可以看出，上面的选择符使用:noViewState后,viewState没有被选择.　

小结:

jQuery的伪类选择符是很强大的一项功能,它内置了很多种方便我们选择的选择符，我们可以嵌套甚至扩展这些伪类选择符.这让我们的js编程更加愉悦了许多.

编缉推荐阅读以下文章

• JQuery Tips(4)----一些关于提高JQuery性能的Tips
• JQuery Tips（3）----关于$()包装集内元素的改变
• JQuery Tips(2)----关于$()包装集你不知道的
• JQuery Tips(1)----关于$.Ready()