首页 > 代码库 > jQuery的选择器
jQuery的选择器
jQuery是JavaScript的一个库，它是一个轻量型的语言。选择器是jQuery最基础的东西，本文中列举的选择器基本上囊括了所有的jQuery选择器，也许各位通过这篇文章能够加深对jQuery选择器的理解，它们本身用法就非常简单，我更希望的是它能够提升个人编写jQuery代码的效率。它有很多的选择器来让我们获取jQuery中的元素节点，下面我们就来具体的说下：
$(“*”)全局选择器，它是用于获取所有的元素；
$(“#id”)是ID选择器，获取元素节点中有ID的元素；可以通过id选择器给所选取的元素，让它改变样式。
$(“.class”)是类选择器，获取元素节点中有类名的元素；
$(“p”)是标签选择器，通过标签获取元素；
$(“.input.demo”)是获取所有class=”input”且class=”demo”的元素；
$(“p:first”)它是获取第一个p元素的；我们可以用它来改变第一个段落的字体大小和颜色等一些样式与效果。下面我们通过一段案例来具体的说明下它的作用
<body>
<p>HTML5</p>
<p>JavaScript</p>
<p>jQuery</p>
</body>
$(function(){
$(“p:first”).css.backgroundColor=”red”;
});
通过上面这段代码我们可以让body中的第一个p标签里面的文本变成红色。
$(“p:last”)它是获取最后一个p元素的；下面我们通过一段案例来具体的说明下它的作用：
<body>
<p>HTML5</p>
<p>JavaScript</p>
<p>jQuery</p>
</body>
$(function(){
$(“p:last”).css.backgroundColor=”yellow”;
});
通过上面这段代码我们可以让body中的最后一个p标签里面的文本变成黄色。
$(“tr:even”)它是获取所有偶数的tr元素的；
$(“tr:odd”)它是获取所有奇数的tr元素的；
$(“ul li:eq(3)”)它是获取ul中第四个里li元素的，它是用index来选择的，index的下标是从0开始的。
$(“ul li:gt(3)”)它是获取ul中的li的index大于3的元素的；
$(“ul li:lt(3)”)它是获取ul中的li的index小于3的元素的；
$(“input:not(:empty)”)是获取所有不为空的input元素的；
$(“:header”)是获取所有的标题元素的，h1-h6；
:animated是获取所有的动画元素的；
$(“:contains(‘W3School’)”)是获取包含指定字符串的所有元素的；
$(“:empty”)是获取无子（元素）节点的所有元素；
$(“p:hidden”)它的作用是隐藏所有的p元素；
$(“table:visible”)是获取所有可见的表格；
$(“[href]”)是获取所有带有href属性的元素的；
$(“[href=http://www.mamicode.com/’#’]”)是获取所有href属性的值等于#的；
$(“[href!=’#’]”)是获取所有href属性的值不等于#的；
$(“[href$=’.jpg’]”)是获取所有href属性的值包含以.jpg结尾的元素。
$(“:input”)是获取所有的input元素的；
$(“:text”)是获取所有type等于text的input元素的；
$(“:password”)是获取所有type等于password的input元素的；
$(“:radio”)是获取所有type等于radio的input元素的；
$(“:checkbox”)是获取所有type等于checkbox的input元素的；
$(“:submit”)是获取所有的type等于submit的input元素的；
$(“:reset”)是获取所有的type等于reset的input元素的；
$(“:button”)是获取所有的type等于button的input元素；
$(“:image”)是获取所有的type等于image的input元素的；
$(“:file”)是获取所有的type等于file的input元素的；
$(“:enabled”)是获取所有激活的input元素的；
$(“:disbled”)是获取所有禁用的input元素的；
$(“:selected”)是获取所有被选取的input元素的；
$(“:checked”)是获取所有被选中的input元素的。
我们在使用这些选择器的时候一定要懂得它的作用，这样它才能发挥的最大的利用价值，只有更好的运用这些选择器，我们才能提高我们的代码编写速度，才能更好的显示我们网页的制作水平和效果。感谢大家，这就是今天我所分享的jQuery选择器。
jQuery的选择器