jquery属性过滤选择器
A. jQuery过滤选择器怎么实现列表隔行变色的效果
<ul>
<li>第1行</li>
<li>第2行</li>
<li>第3行</li>
<li>第4行</li>
</ul>
<script>
$(function(){
$("ul li:nth-child(odd)").css("background-color","blue"); //单数行背景色回
$("ul li:nth-child(even)").css("background-color","red"); //双数答行背景色
});
</script>
B. jquery过滤选择器有哪些
（1）Jquery中简单过滤选择器
jquery根据某一类过滤规则进行元素匹配，书写时以：版开头，是Jquery中应用最为广泛的选权择器
（2）简单过滤选择器的基本语法
①first()或者：first 获取第一个元素
②last()或者：last 获取最后一个元素
③：not(selector)获取除开给定选择器的其他元素
④：even获取索引为偶数的元素，索引从0开始
⑤：odd获取索引为奇数的元素，索引从0开始
⑥：eq(index)获取制定索引元素，从0开始
⑦：gt(index)获取大于给定索引的元素，从0开始
⑧：lt(index)获取小于给定索引的元素，从0开始
⑨：header获取标题类型元素
⑩:animated获取正在执行动画效果的元素
C. 如何把变量传入jQuery的属性过滤选择器
vararr=["idName","idAddress",...];
//要拼接成字符串形式
varselect="[id^="+arr[i]+"]";
$(select)
D. jquery中简单过滤选择器有哪些
1. 基本过滤选择器
a) ":first"，选取第一个元素，别忘记它也是被放在一个集合里哦！因为JQuery它是DOM对象的一个集合。如，“$("tr:first")”返回所有tr元素的第一个tr元素，它仍然被保存在集合中。
b)“:last”，选取最后一个元素。如，“$("tr:last")”返回所有tr元素的最后一个tr元素，它仍然被保存在集合中。
c)“:not(selector)”，去除所有与给定选择器匹配的元素。如，“$("input:not(:checked)")”返回所有input元素，但去除被选中的元素（单选框、多选框）。
d)“:even”，选取所有元素中偶数的元素。因为JQuery对象是一个集合，这里的偶数指的就是集合的索引，索引从0开始。
e) “:odd”，选取所有元素中奇数的元素，索引从0开始。
f) “:eq(index)”，选取指定索引的元素，索引从0开始。
g) “:gt(index)”，选取索引大于指定index的元素，索引从0开始。
h) “:lt(index)”，选取索引小于指定index的元素，索引从0开始。
i) “:header”，选取所有的标题元素，如hq、h2等。
j) “:animated”，选取当前正在执行的所有动画元素。
2). 内容过滤选择器
它是对元素和文本内容的操作。
a) “:contains(text)”，选取包含text文本内容的元素。
b) “:empty”，选取不包含子元素或者文本节点的空元素。
c) “:has(selector)”，选取含有选择器所匹配的元素的元素。
d) “:parent”，选取含有子元素或文本节点的元素。（它是一个父节点）
3). 可见性过滤选择器
根据元素的可见与不可见状态来选取元素。
“:hidden”，选取所有不可见元素。
“:visible”，选择所有可见元素。
可见选择器：hidden 不仅包含样式属性 display 为 none 的元素，也包含文本隐藏域 (<input type=“hidden”>)和 visible:hidden 之类的元素。
4).属性过滤选择器
通过元素的属性来选取相应的元素。
a) “[attribute]”，选取拥有此属性的元素。
b) “[attribute=value]”，选取指定属性值为value的所有元素。
c) “[attribute !=value]”，选取属性值不为value的所有元素。
d) “[attribute ^= value]”，选取属性值以value开始的所有元素。
e) “[attribute $= value]”，选取属性值以value结束的所有元素。
f) “[attribute *= value]”，选取属性值包含value的所有元素。
g) “[selector1] [selector2]…[selectorN]”，复合性选择器，首先经[selector1]选择返回集合A，集合A再经过[selector2]选择返回集合B，集合B再经过[selectorN]选择返回结果集合。
5). 子元素过滤选择器
一看名字便是，它是对某一元素的子元素进行选取的。
a) “:nth-child(index/even/odd)”，选取索引为index的元素、索引为偶数的元素、索引为奇数的元素。
l nth-child(even/odd)：能选取每个父元素下的索引值为偶(奇)数的元素。
l nth-child(2)：能选取每个父元素下的索引值为 2 的元素。
l nth-child(3n)：能选取每个父元素下的索引值是 3 的倍数的元素。
l nth-child(3n + 1)：能选取每个父元素下的索引值是 3n + 1的元素。
b) “:first-child”，选取第一个子元素。
c) “:last-child”，选取最后一个子元素。
d) “:only-child”，选取唯一子元素，它的父元素只有它这一个子元素。
6). 表单过滤选择器
选取表单元素的过滤选择器。
a) “:input”，选取所有<input>、<textarea>、<select >和<button>元素。
b) “:text”，选取所有的文本框元素。
c) “:password”，选取所有的密码框元素。
d) “:radio”，选取所有的单选框元素。
e) “:checkbox”，选取所有的多选框元素。
f) “:submit”，选取所有的提交按钮元素。
g) “:image”，选取所有的图像按钮元素。
h) “:reset”，选取所有重置按钮元素。
i) “:button”，选取所有按钮元素。
j) “:file”，选取所有文件上传域元素。
k) “:hidden”，选取所有不可见元素。
7).表单对象属性过滤选择器
选取表单元素属性的过滤选择器。
“:enabled”，选取所有可用元素。
“:disabled”，选取所有不可用元素。
“:checked”，选取所有被选中的元素，如单选框、复选框。
“:selected”，选取所有被选中项元素，如下拉列表框、列表框。
E. jquery属性过滤器选择器
我想 你这里ID可能是会变化的吧
可以直接使用$(this).next("span").css("imgSpanPos");
F. 8.jquery过滤选择器有哪些
$("#myDiv");
<div id="myDiv">id="myDiv"</div>（比较常用）
$("div")；
<div>DIV1</div>
$(".myClass");
<div class="myClass">div class="myClass"</div>（比较常用）
$("*") ；
<div>DIV</div><span>SPAN</span><p>P</p>
$("div,span,p.myClass") ；
<div>div</div>
<p class="myClass">p class="myClass"</p>
<span>span</span>
$("form input") ；
<input name="name" />,
<input name="newsletter" />（比较常用）
$("input[name='newsletter']").attr("checked", true);
<input type="checkbox" name="newsletter" value="Hot Fuzz" checked="true" />, （比较常用）
前面是选择器内写法，后面是得容到的结果。
G. jquery选中元素使用哪些选择器
JQuery 选择器
在 HTML DOM 术语中：选择器允许您对 DOM 元素内组或单个 DOM 节点进行容操作。
jQuery 元素选择器
jQuery 使用 CSS 选择器来选取 HTML 元素。
$("p") 选取 <p> 元素。
$("p.intro") 选取所有 class="intro" 的 <p> 元素。
$("p#demo") 选取所有 id="demo" 的 <p> 元素。
jQuery 属性选择器
jQuery 使用 XPath 表达式来选择带有给定属性的元素。
$("[href]") 选取所有带有 href 属性的元素。
$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。
$("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。
$("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。
jQuery 参考手册 - 选择器
H. jQuery基本选择器选择元素使用介绍
复制代码
代码如下:
<html
xmlns="http://www.w3.org/1999/xhtml">
<head>
<!--
1.基本选择器：是jQuery中使用最频繁的选择器，它由元素Id、Class、元素名、多个选择符组成，通过基本选择器可以实现大多数页面元素的查找
jQuery选择器详解
根据所获取页面中元素的不同，可以将jQuery选择器分为：基本选择器、层次选择器、过滤选择器、表单选择器四大类。其中，在过滤选择器中有可以分为：简单过滤选择器、内容过滤选择器、可见性过滤选择器、属性过滤选择器、子元素过滤选择器、表单对象属性过滤选择器6种
-->
<title></title>
<!--使用jQuery基本选择器选择元素：一个页面包含两个<div>标记，其中一个用于设置ID属性，另一个用于设置Class属性；我们再增加一个<span>标记，全部元素初始值均为隐藏，然后通过jQuery基本选择器显示相应的页面标记。-->
<script
src="jquery-1.9.1.js"
type="text/javascript"></script>
<style
type="text/css">
body{font-size:12px;text-align:center;}
.clsFrame{width:300px;height:100px}
.clsFrame
div,span{display:none;float:left;width:65px;height:65px;border:solid
1px
#ccc;margin:8px}
.clsOne{background-color:#eee}
</style>
<script
type="text/javascript">
$(function
()
{
//ID匹配元素
$('#divOne').css('display',
'block');
})
$(function
()
{
//元素名匹配元素
$('div
span').css('display',
'block');
})
$(function
()
{
//类匹配元素
$('.clsFrame
.clsOne').css('display',
'block');
})
$(function
()
{
//匹配所有元素
$('*').css('display',
'block');
})
$(function
()
{
//合并匹配元素
$('#divOne,span').css('display',
'block');
})
</script>
</head>
<body>
<div
class="clsFrame">
<div
id="divOne">
ID</div>
<div
class="clsOne">
CLASS</div>
<span>SPAN</span>
</div>
</body>
</html>
I. jquery 选择器 属性可以用<比较吗
并没有，所有属性选择器如下。
属性过滤选择器
属性过滤选择器的过滤规则是通过元素的属性来获取相应的元素。
♠ [attribute]
描述：选取拥有此属性的元素。
返回：集合元素。
示例：$("div[id]")选取拥有属性id的元素。
♠ [attribute=value]
描述：选取属性的值为value的元素。
返回：集合元素。
示例：$("div[title=test]")选取属性title为"test"的<div>元素。
♠ [attribute!=value]
描述：选取属性的值不等于value的元素。
返回：集合元素。
示例：$("div[title!=test]")选取属性title不等于"test"的<div>元素。（注：没有属性title的<div>元素也会被选取）
♠ [attribute^=value]
描述：选取属性的值以value开始的元素。
返回：集合元素。
示例：$("div[title^=test]")选取属性title以"test"开始的<div>元素。
♠ [attribute$=value]
描述：选取属性的值以value结束的元素。
返回：集合元素。
示例：$("div[title$=test]")选取属性title以"test"结束的<div>元素。
♠ [attribute*=value]
描述：选取属性的值含有value的元素。
返回：集合元素。
示例：$("div[title*=test]")选取属性title含有"test"的<div>元素。
♠ [attribute|=value]
描述：选取属性等于给定字符串或以该字符串为前缀（该字符串后跟一个连字符“-”）的元素。
返回：集合元素。
示例：$("div[title|='en']")选取属性title等于en或以en为前缀（该字符串后跟一个连字符‘-’）的元素。
♠ [attribute~=value]
描述：选取属性用空格分隔的值中包含一个给定的值的元素。
返回：集合元素。
示例：$("div[title~='uk']")选取属性title用空格分隔的值中包含字符uk的元素。
♠ [attribute1][attribute2][attributeN]
描述：用属性选择器合并成一个复古属性选择器，满足多个条件。每选择一次，缩小一次范围。
返回：集合元素。
示例：$("div[id][title$='test']")选取拥有属性id，并且属性title以"test"结束的<div>元素。
所有jquery选择器可参照我写的博客：http://www.cnblogs.com/weilan/p/7152216.html
J. JQuery中基础过滤选择器用法实例分析
本文实例讲述了JQuery中基础过滤选择器用法。分享给大家供大家参考。具体如下：
<!DOCTYPE
html
PUBLIC
"-//W3C//DTD
XHTML
1.0
Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html
xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta
http-equiv="Content-Type"
content="text/html;
charset=utf-8"
/>
<title>基础过滤选择器</title>
<style
type="text/css">
#main{
width:600px;
border:1px
solid
green;
margin:auto;
padding:10px;
}
#tbl{
border-collapse:collapse;
border-top:1px
solid
red;
border-left:1px
solid
red;
margin:auto;
}
#tbl
td{
width:60px;
height:60px;
border-collapse:collapse;
border-bottom:1px
solid
red;
border-right:1px
solid
red;
}
</style>
<script
src="jquery-1.6.2.min.js"
type="text/javascript"></script>
<script
type="text/javascript">
$(function
()
{
//=============举例1========================
//:first
说明:
匹配找到的第一个元素
//....<1>修改第一个单元格的背景色
//var
$tds
=
$("#tbl
td:first");
//$tds.css("backgroundColor",
"blue");
//....<2>修改第一行的背景色
//var
$trs
=
$("#tbl
tr:first");
//$trs.css("backgroundColor",
"blue");
//=============举例2========================
//:last
说明:
匹配找到的最后一个元素.与
:first
相对应.
//...<1>修改随后一个单元格的背景色
//var
$tds
=
$("#tbl
td:last");
//$tds.css("backgroundColor",
"blue");
//=============举例3========================
//:not(selector)
去除所有与给定选择器匹配的元素.有点类似于”非”
//...<1>把所有class不为tdClass的列的文本进行修改
//var
$tds
=
$("#tbl
td:not(.tdClass)");
//$tds.text("Not
tdClass");
//=============举例4========================
//:even
说明:
匹配所有索引值为偶数的元素，从
0
开始计数.js的数组都是从0开始计数的.
//例如要选择table中的行,因为是从0开始计数,所以table中的第一个tr就为偶数0.
//...<1>把索引值为偶数的行变成黄色
//var
$trs
=
$("#tbl
tr:even");
//$trs.css("backgroundColor",
"yellow");
//=============举例5========================
//:
odd
说明:
匹配所有索引值为奇数的元素,和:even对应,从
0
开始计数.
//var
$trs
=
$("#tbl
tr:odd");
//$trs.css("backgroundColor",
"yellow");
//=============举例6========================
//:eq(index)
说明:
匹配一个给定索引值的元素.eq(0)就是获取第一个tr元素.括号里面的是索引值,不是元素排列数.
//...<1>设置第二个单元格的背景色
//var
$tds
=
$("#tbl
td:eq(1)");
//$tds.css("backgroundColor",
"gray");
//=============举例6========================
//:gt(index)
说明:
匹配所有大于给定索引值的元素.
//...<1>把下标索引大于1的所有单元格背景色设置为灰色
//var
$tds
=
$("#tbl
td:gt(1)");
//$tds.css("backgroundColor",
"gray");
//=============举例7========================
//:lt(index)
说明:
匹配所有小于给定索引值的元素.
//...<1>把下标索引小于3的所有单元格背景色设置为灰色
var
$tds
=
$("#tbl
td:lt(3)");
$tds.css("backgroundColor",
"gray");
//=============举例8========================
//:header(固定写法)
说明:
匹配如
h1,
h2,
h3之类的标题元素.这个是专门用来获取h1,h2这样的标题元素.
//...<1>把所有的h标签背景色进行修改
var
$hs
=
$(":header");
$hs.css("backgroundColor",
"gold");
//=============举例8========================
//slice
获取下标范围内元素
var
$trs
=
$("#tbl
tr").slice(1,
3);
$trs.css("backgroundColor",
"gold");
});
</script>
</head>
<body>
<div
id="main">
<h1>我是h1</h1>
<h2>我是h2</h2>
<h3>我是h3</h3>
<table
id="tbl">
<tr>
<td>1</td><td>1</td><td>1</td>
</tr>
<tr>
<td
class="tdClass">2</td><td>2</td><td>2</td>
</tr>
<tr>
<td>3</td><td>3</td><td>3</td>
</tr>
<tr>
<td>4</td><td>4</td><td
class="tdClass">4</td>
</tr>
<tr>
<td>5</td><td>5</td><td>5</td>
</tr>
<tr>
<td>6</td><td>6</td><td
class="tdClass">6</td>
</tr>
</table>
</div>
</body>
</html>
希望本文所述对大家的jQuery程序设计有所帮助。