jQuery学习笔记三:层级选择器
2016-08-02 14:04
633 查看
层级选择器(Descendant Selector)
<!-- HTML结构 --> <div class="testing"> <ul class="lang"> <li class="lang-javascript">JavaScript</li> <li class="lang-python">Python</li> <li class="lang-lua">Lua</li> </ul> </div> // 以下两种方式都可以选出相应的<li>节点 $('ul.lang li.lang-javascript'); // [<li class="lang-javascript">JavaScript</li>] $('div.testing li.lang-javascript'); // [<li class="lang-javascript">JavaScript</li>]
// 选择范围限定在name属性为upload的表单里 $('form[name=upload] input'); // 多层选择 $('form.test p input'); // 在form表单选择被<p>包含的<input>
子选择器(Child Selector)
子选择器$('parent>child')类似层级选择器,但
<child>节点必须是
<parent>节点的直属子节点:
$('ul.lang>li.lang-javascript'); // 可以选出[<li class="lang-javascript">JavaScript</li>] $('div.testing>li.lang-javascript'); // [], 无法选出,因为<div>和<li>不构成父子关系
过滤器(Filter)
$('ul.lang li'); // 选出JavaScript、Python和Lua 3个节点 $('ul.lang li:first-child'); // 仅选出JavaScript $('ul.lang li:last-child'); // 仅选出Lua $('ul.lang li:nth-child(2)'); // 选出第N个元素,N从1开始 $('ul.lang li:nth-child(even)'); // 选出序号为偶数的元素 $('ul.lang li:nth-child(odd)'); // 选出序号为奇数的元素
表单相关
特殊的选择器::input:可以选择
<input>,
<textarea>,
<select>和
<button>;
:file:可以选择,和input[type=file]一样;
:checkbox:可以选择复选框,和
input[type=checkbox]一样;
:radio:可以选择单选框,和input[type=radio]一样;
:focus:可以选择当前输入焦点的元素,例如把光标放到一个
<input>上,用
$('input:focus')就可以选出;
:checked:选择当前勾上的单选框和复选框,用这个选择器可以立刻获得用户选择的项目,如
$('input[type=radio]:checked');
:enabled:可以选择可以正常输入的
<input>、
<select>等,也就是没有灰掉的输入;
:disabled:和
:enabled正好相反,选择那些不能输入的。
$('div:visible'); // 所有可见的div $('div:hidden'); // 所有隐藏的div
相关文章推荐
- jQuery之层级选择器学习笔记
- 前端学习笔记-jquery-6-层级选择器及对应jquery方法
- JQuery学习笔记02-选择器把需要的东西揪出来(基础)
- JQuery学习笔记1:选择器之一
- jQuery学习笔记之jQuery选择器的使用
- JQuery 参考手册 学习笔记(4)-选择器
- jQuery学习笔记——jQuery选择器详解种类与方法
- JQuery 学习笔记 选择器之三
- JQuery 选择器学习笔记
- jQuery学习笔记之jQuery选择器的使用
- JQuery学习笔记(一)选择器
- jQuery学习笔记——各类选择器
- JQuery学习笔记6:选择器之六
- jQuery学习笔记(二)选择器 事件
- JQuery 学习笔记 选择器之六
- jQuery学习笔记--jQuery选择器
- JQuery 学习笔记 选择器之四
- jquery学习笔记一:选择器高级语法
- Jquery选择器的概念以及选择器的学习一(基本、层级、简单,另有简单动画效果代码)
- jQuery学习笔录2(jQuery学习笔记——选择器(2)&过滤器)