HTML示例代码

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--HTML区域-->
<h1>第一个标题</h1>
<div class="nav-2014">
<div class="w">
<div class="w-spacer"></div>
<div class="categorys">
<div class="dt">家用电器分类</div>
</div>
<span class="hr"></span>
<div class="navitems-2014">
<div id="treasure"></div>
<span class="clr"></span>
<span class="chr"></span>
男:<input type="checkbox" checked="checked" value="nan">
女:<input type="checkbox" value="nv">
</div>
</div>
</div>
<h2>第二个标题</h2>
<div id="electronic">
<div id="firstScreen">1
<div class="w">2</div>
</div>
<ul>
<div class="u_c" lang="en-us"></div>
<li class="ui-switch-curr"></li>
<li class="ui-switch-item"></li>
<li class="ui-switch-next"></li>
<li class="ui-switch-sub"></li>
</ul>
<div class="secord_screen"></div>
<div class="third_screen"></div>
</div>
</body>
</html>

  伪类选择器:即以:开头的

  :first  获取第一个元素

  :not(selector) 去除所有选定的元素

  :even 匹配索引为偶数的元素

  :odd 匹配索引为奇数的元素

  :eq(index) 匹配给定的索引

  :gt(index) 大于指定的索引

  :lt(index) 小于指定的索引

  :last 匹配获取的最后一个元素

  :header 匹配所有标题元素

  示例:

    <!--jquery区域-->
<script src="jquery-3.1.0.js"></script>
<script>
// 获取id为electronic下所有孩子div中的第一个,即id为firstScreen的div
$("#electronic > div:first")
// 获取所有li元素中最后一个元素
$("li:last")
// 获取所有input元素中非checked的元素,即女:<input type="checkbox" value="nv">
$("input:not(:checked)")
// 获取所有li元素中索引为0,2,4...的元素
$("li:even")
// 获取所有li元素中索引为1,3,5...的元素
$("li:odd")
// 获取所有li元素中索引为1的元素
$("li:eq(1)")
// 获取所有li元素中索引大于1的元素
$("li:gt(1)")
// 获取所有li元素中索引小于1的元素
$("li:lt(1)")
// 给所有标题加上背景色
$(":header").css("background","red")
console.log(cls)
</script>

  

jquery选择器之基本筛选器的更多相关文章

  1. jQuery选择器之基本筛选选择器

    <h2>基本筛选器</h2> <h3>:first/:last/:even/:odd</h3> <div class="left&quo ...

  2. jquery选择器之基本筛选选择

    1.基本选择器 2.内容筛选选择器 3.可见性筛选选择器 4.属性筛选选择器 5.子元素筛选选择器 6.表单元素选择器 7.表单对象属性筛选器

  3. jQuery选择器之属性筛选选择器

    在这么多属性选择器中[attr="value"]和[attr*="value"]是最实用的 [attr="value"]能帮我们定位不同类型 ...

  4. jQuery查找标签--选择器,筛选器,模态对话框, 左侧菜单栏

    查找标签 选择器: 基本选择器(同css) id选择器 $("#id") 标签选择器 $('tagName') class选择器 $(".className") ...

  5. jQuery选择器之表单对象属性筛选选择器

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content ...

  6. 解密jQuery内核 Sizzle引擎筛选器 - 位置伪类(一)

    本章开始分析过滤器,根据API的顺序来 主要涉及的知识点 jQuery的组成 pushStack方法的作用 sizzle伪类选择器 首页我们知道jQuery对象是一个数组对象 内部结构 jQuery的 ...

  7. jQuery选择器之全面总结

    选择器是jQuery的根基,在jQuery中,对事件处理,遍历DOM和Ajax操作都依赖于选择器.如果能熟练的使用选择器,不仅能简化代码,而且可以达到事半功倍的效果. jQuery中的选择器完全继承了 ...

  8. jQuery选择器之表单元素选择器

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content ...

  9. jQuery选择器之属性选择器Demo

    测试代码: 06-属性选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...

随机推荐

  1. django中“url映射规则”和“服务端响应顺序”

    1.django搜索路径 使用 import 语句时,Python 所查找的系统目录清单.      查看方式:         import sys        print sys.path   ...

  2. UI里的UIActionSheet按钮

    1.效果图:分别为有短信分享                                      无短信分享 -(void)viewDidLoad{ //添加按钮 UIButton *share ...

  3. logistic回归模型

    一.模型简介 线性回归默认因变量为连续变量,而实际分析中,有时候会遇到因变量为分类变量的情况,例如阴性阳性.性别.血型等.此时如果还使用前面介绍的线性回归模型进行拟合的话,会出现问题,以二分类变量为例 ...

  4. IIS6.0开启gzip压缩(来自百度)

    IIS6.0开启gzip压缩 | 更新:2012-08-10 10:29 1 2 3 4 5 分步阅读 开启gzip可以极大的加速网站.有时压缩比率高达80%,近来测试了一下,最少都有40%以上,还是 ...

  5. csu 1809 Parenthesis

    题目见此 分析,把'('当成1, ')'当成-1, 计算前缀和sum. 记交换括号左边的序号为u, 右边为v,讨论左右括号: 1.s[u] == '(' && s[v] == ')' ...

  6. NetworkComms V3 之自定义对象

    NetworkComms网络通信框架序言 能够发送自定义对象,并且在发送的时候对发送的对象进行加密,压缩是networkComms v3框架的一个重要特性. 具体可以参考源码中 ExampleCons ...

  7. .net中大数据的处理

    前提:sqlserver数据库 问题:需要从数据量达千万级或是更大的数据库中找出一条需要的数据. 1,先分析大数据的结构,以及数据的流向.以及此过程中那些地方会有瓶颈. 2,针对瓶颈制定方案: 1.1 ...

  8. Svn常见问题及相关原因

    1. svn: Server sent unexpected return value (500 Internal Server Error) in response to OPTIONS reque ...

  9. HDU 4939 Stupid Tower Defense (2014 Multi-University Training Contest 7)

    思路:首先红色肯定要放在最后面.前面蓝色和绿色dp求解. dp[i][j]  表示前面(i+j) 个 有 i 个蓝色塔  j个绿色塔 能造成最大伤害. //====================== ...

  10. Node.js 全局对象

    JavaScript 中有一个特殊的对象,称为全局对象(Global Object),它及其所有属性都可 以在程序的任何地方访问,即全局变量. 在浏览器JavaScript 中,通常window 是全 ...