站长百科 | 数字化技能提升教程 数字化时代生存宝典
首页
数字化百科
电子书
建站程序
开发
服务器
办公软件
开发教程
服务器教程
软件使用教程
运营教程
热门电子书
WordPress教程
宝塔面板教程
CSS教程
Shopify教程
导航
程序频道
推广频道
网赚频道
人物频道
网站程序
网页制作
云计算
服务器
CMS
论坛
网店
虚拟主机
cPanel
网址导航
WIKI使用导航
WIKI首页
最新资讯
网站程序
站长人物
页面分类
使用帮助
编辑测试
创建条目
网站地图
站长百科导航
站长百科
主机侦探
IDCtalk云说
跨境电商导航
WordPress啦
站长专题
网站推广
网站程序
网站赚钱
虚拟主机
cPanel
网址导航专题
云计算
微博营销
虚拟主机管理系统
开放平台
WIKI程序与应用
美国十大主机
编辑“
JQuery选择器
”
人物百科
|
营销百科
|
网赚百科
|
站长工具
|
网站程序
|
域名主机
|
互联网公司
|
分类索引
跳转至:
导航
、
搜索
警告:
您没有登录。如果您做出任意编辑,您的IP地址将会公开可见。如果您
登录
或
创建
一个账户,您的编辑将归属于您的用户名,且将享受其他好处。
反垃圾检查。
不要
加入这个!
<span style="border:1px solid #000; text-align:center; float:right; padding:6px; margin-bottom:15px;"><strong>导航:</strong> [[JQuery|上一页]] | {{Template:JavaScript导航}}</span> <div style="clear:both;"></div> jQuery的选择器是CSS 1-3,XPath的结合物。jQuery提取这二种查询语言最好的部分,融合后创造出了最终的jQuery表达式查询语言。 '''简单的jQuery选择器''' 很多jQuery程序,绝大部分的函数都是从$()开始的,$()函数简化了javascript获取DOM元素的复杂性,消除了使用for循环获取一组DOM元素,所以$()函数获取的DOM元素其实是一个DOM元素组成的数组。 '''eg:''' *$(”div”):标签名,取得DOM文档中所有[[div]]标签的元素,返回的是一个元素集合; *$(”#nickName”):[[ID]]属性,取得DOM文档中ID为nickName的一个元素(ps:一个文档中ID是唯一的),返回的是一个元素; *$(”.user”):样式名,取得[[DOM]]文档中[[class]]为user的所有元素,返回的是一个元素集合; 这里再补充1个通配符,即*: *$(”*”):通配符,取得DOM文档中所有节点元素;例如:$(”*”).css(”color”,”#FF3300″);则整个文档的文字颜色都会显示红色。 '''jQuery的组合选择器:''' $(”selector1,selector2,selectorN”):多元素组合选择器,将每一个选择器匹配到的元素合并后一起返回。你可以指定任意多个选择器,并将匹配到的元素合并到一个结果内。例如:$(”h1,div,li#nickName”) '''JQuery的层级选择器:''' *$(”ancestor descendant”):在给定的祖先元素下匹配所有的后代元素,即子孙元素,例如:$(”div span.num”); *$(”parent > child”):在给定的父元素下匹配所有的子元素,例如:$(”div>span”); *$(”prev + next”):匹配所有紧接在prev元素后的next元素,即第一个跟在后面的兄弟元素,例如:$(”p+span”); *$(”prev ~ siblings”):匹配 prev 元素之后的所有 siblings 元素,即一群跟屁虫的兄弟元素(当然也有可能是一个屁虫的兄弟元素,那就和$(”prev + next”)等价了),例如:$(”p~span”); '''简单的过滤选择器''' * :animated:匹配所有正在执行动画效果的元素集合; * :eq(index):匹配索引为index的一个元素,例如:$(”div:eq(0)”)//第一个div; * :even:匹配索引为偶数的元素集合,例如:$(”div:even”); * :odd:匹配索引为奇数的元素集合,例如:$(”div:odd”); * :first:匹配找到的第一个元素,等价于:eq(0),例如:$(”div:first”); * :gt(index) :匹配索引大于index的 元素集合,例如:$(”div:gt(0)”)//除了第一个div外的所以div; * :lt(index):匹配索引小于于index的 元素集合,例如:$(”div:lt(0)”); * :header:匹配h1-h6的所有元素集合; * :last:匹配找到的最后一个元素,例如:$(”div:last”)//最后一个div; * :not(selector):去除所有与给定选择器匹配的元素,例如:$(”input:not(:checked)”)//除了被选中的所有input; '''Jquery的子元素选择器''' * :first-child :匹配每个父元素的第一个子元素,相当于E:nth-child(0),例如:$(”ul li:first-child”); * :last-child :匹配每个父元素的最后一个子元素,例如:$(”ul li: last -child”); * :nth-child(index/even/odd/equation):匹配每一个父元素的第N个子或奇偶元素,例如:$(”ul li:nth-child(2)”); * :only-child :如果某个元素是父元素中唯一的子元素,那将会被匹配$(”ul li:only-child”); '''子元素选择器和过滤性选择器的一些区别''' * :first-child和:first: :first只匹配一个元素,而:first-child将为每个父元素匹配一个子元素,所以:first-child匹配出来的是一个集合当然也有可能只匹配一个元素,而:first永远只能匹配到一个元素。 * :last-child和:last的区别道理也是一样的; ''':nth-child(index/even/odd/equation)和:eq(index)''' * :eq(index) 只匹配一个元素,索引值从0开始; * :nth-child(index/even/odd/equation) 匹配每一个父元素的第N个子或奇偶元素, 索引值从1开始,并且提供更丰富的参数及表达式; * :nth-child(even)// 匹配每一个父元素的偶数元素; * :nth-child(odd) // 匹配每一个父元素的奇数元素; * :nth-child(3n) // 匹配每一个父元素的索引值能被3整除的元素; * :nth-child(2) // 匹配每一个父元素的第2个元素; * :nth-child(3n+1) // 匹配每一个父元素的索引值被3整除后余1的元素 * :nth-child(3n+2) // 匹配每一个父元素的索引值被3整除后余2的元素 所以:nth-child(index/even/odd/equation)匹配出来的是一个集合当然也有可能只匹配一个元素,而:eq(index)永远只能匹配到一个元素。 [[category:JQuery]] [[category:JavaScript]]
摘要:
请注意,您对站长百科的所有贡献都可能被其他贡献者编辑,修改或删除。如果您不希望您的文字被任意修改和再散布,请不要提交。
您同时也要向我们保证您所提交的内容是您自己所作,或得自一个不受版权保护或相似自由的来源(参阅
Wordpress-mediawiki:版权
的细节)。
未经许可,请勿提交受版权保护的作品!
取消
编辑帮助
(在新窗口中打开)
本页使用的模板:
模板:JavaScript导航
(
编辑
)