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. Linux vi/vim

    所有的 Unix Like 系统都会内建 vi 文书编辑器,其他的文书编辑器则不一定会存在. 但是目前我们使用比较多的是 vim 编辑器. vim 具有程序编辑的能力,可以主动的以字体颜色辨别语法的正 ...

  2. JAVA学习之路（环境配置,）

    最近过去的寒假我就开始看一些JAVA的学习视频了,视频是毕向东老师的,讲得还不错,东北口音,欧了没? 首先是一些基础概念. 1.JAVA的三种技术架构 企业版 J2EE 标准版 J2SE 小型版 J2 ...

  3. 【接口测试】Jenkins+Ant+Jmeter搭建持续集成的接口测试平台

    参考文档: http://www.cnblogs.com/liuqi/p/5224579.html

  4. 樱花漫地集于我心，蝶舞纷飞祈愿相随 训练：a preparation 训练：a preparation

    知识点:                                                                                               分 ...

  5. Linux cat命令的使用

    cat命令主要用来查看文件内容,创建文件,文件合并,追加文件内容等功能.   A:查看文件内容主要用法: 1.cat f1.txt,查看f1.txt文件的内容. 2.cat -n f1.txt,查看f ...

  6. dpkg命令的用法

    dpkg 是Debian package的简写,为”Debian“ 操作系统 专门开发的套件管理系统,用于软件的安装,更新和移除. 所有源自"Debian"的Linux的发行版都使 ...

  7. CXF支持 SOAP1.1 SOAP1.2协议

    SOAP协议分为两个版本 1.1 1.2 默认支持1.1   实现方式:   1.编写接口   import javax.jws.WebService; @WebService public inte ...

  8. .htaccess应该放在哪里？

    根据 Apache 官方的介绍,.htaccess 文件属于分布式配置文件,可以放置在网站 www 根目录的所有子目录.以及 www 根目录的上一级目录中,生效的路径总是当前目录及其所有子目录(可在文 ...

  9. JavaScript中的eval()函数

    和其他很多解释性语言一样,JavaScript同样可以解释运行由JavaScript源代码组成的字符串,并产生一个值.JavaScript通过全局函数eval()来完成这个工作. eval(“1+2” ...

  10. UIView及其子类

    一.UI概述 UI(User Interface):用户界⾯,用户能看到的各种各样的⻚面元素. iOS App = 各种各样的UI控件 + 业务逻辑和算法 二.UIView 在手机上显示的内容都是UI ...