繁星——JQuery选择器之层级
[ancestor descendant]
在给定元素下匹配所有后代元素。这个选择器的使用概率相当之高,使用示例如下:
//HTML代码:
<div id='div01'>
<input type="text" class='inp01' value=""/>
<span><input type="text" class='inp02' value=""/></span>
</div>
//JQuery代码:
$("#div01 input");
结果:
<input type="text" class='inp01' value=""/> <input type="text" class='inp02' value=""/>
[parent > child]
此选择器用于在给定的父元素下匹配所有的子元素,使用如下:
HTML代码同上,jquery代码如下:
$("#div01 > input");
结果:
<input type="text" class="inp01" value=""/>
[prev + next]
此选择器匹配所有紧接在 prev 元素后的 next 元素,使用示例如下:
HTML代码同上,JQuery代码如下:
$(".inp01 span");
结果:
<span><input type="text" class='inp02' value=""/></span>
[prev ~ siblings]
匹配 prev 元素之后的所有 siblings (同辈)元素
HTML:
<form>
<label>Name:</label>
<input name="name" />
<fieldset>
<label>Newsletter:</label>
<input name="newsletter" />
</fieldset>
</form>
<input name="none" />
JQuery代码:
$("form ~ input");
结果:
<input name="none" />
千里之行始于足下,原本不打算写这个的,因为这个太过基础,后来想想基础才是一切的源头,大家还是不应忽略基础,还是写了。
繁星——JQuery选择器之层级的更多相关文章
- jquery选择器之层级选择器
HTML示例代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
- jquery选择器之层级过滤选择器
$("ancestor descendant"):选取parent元素后所有的child元素 $("parent > child"):选取parent元素 ...
- jQuery选择器之全面总结
选择器是jQuery的根基,在jQuery中,对事件处理,遍历DOM和Ajax操作都依赖于选择器.如果能熟练的使用选择器,不仅能简化代码,而且可以达到事半功倍的效果. jQuery中的选择器完全继承了 ...
- jQuery选择器之属性选择器Demo
测试代码: 06-属性选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...
- jQuery选择器之内容过滤选择器Demo
测试代码: 04-内容过滤选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &q ...
- jQuery选择器之基本过滤选择器Demo
测试代码: 03-基本过滤选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &q ...
- jQuery选择器之层次选择器Demo
测试代码: 02-层次选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...
- jQuery选择器之基本选择器Demo
测试代码: 01-基本选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...
- jQuery选择器之id选择器
页面的任何操作都需要节点的支撑,开发者如果快速高效的找到指定的节点也是前端开发中的一个重点.jQuery提供了一系列的选择器帮助开发者达到这一目的,让开发者可以更少的处理复杂选择过程与性能优化,更多专 ...
随机推荐
- requirejs学习
- boost asio sync
Service: #include<boost/asio.hpp> #include<boost/thread.hpp> #include<iostream> #i ...
- git学习——git理解和仓库的创建
一.git用的3个工作的状态的理解. 1. 工作区 workspace(modified); 2. 暂存区 stage(staged) ; 3. git本地仓库 repository(commited ...
- python 初级1
List:Python内置的一种数据类型是列表:list.list是一种有序的集合,可以随时添加和删除其中的元素. 构造list非常简单,按照上面的代码,直接用 [ ] 把list的所有元素都括起来, ...
- in_array,array_search的使用
写一个数组里面有小写a-z 大写A-Z 以及数字,把相似的数字和字母都剔除 无论大小写:将括号内的数字剔除(0,o,2,Z,1,i) $arr1 = range("a", ...
- -/bin/sh: ./led: not found的解决办法
环境介绍: 开发板:qq2440 交叉编译器:arm-linux-gcc 3.4.1 内核版本:2.6.13 一.针对该类问题从两个方面入手: 1.从权限出发,权限不够会出现此问题 2.从库文件出发, ...
- Openfire on Centos7
学习一下linux,装备 1)centos 最小安装.(找抽的节奏) 2)必备 oepnssh yum install openssh-server.x86_64 3)配置网络.打开 /etc/sys ...
- Java链接MySQL练习题:格式化日期、性别;避免代码注入
一.查询人员名单,按序号 姓名 性格(男或女) 民族(某族) 生日(年月日)输出 import java.sql.*; import java.text.SimpleDateFormat; publi ...
- Sublime Text2 javascript格式化插件JsFormat
一.安装方法: 按下快捷键 Ctrl+Alt+p 打开命令面板 输入install 这时下拉框第一项就会显示安装包控制器(这个需要初始化安装,不明白的搜索本站关于sublime Text2 的介绍) ...
- Linux下LVM
http://www.cnblogs.com/xiaoluo501395377/archive/2013/05/22/3093405.html