<body style="overflow: scroll;">

    <h1>我的测试</h1>

    <div id="111">

        <p class="first">第一个p标签</p>

        <p class="second">

            第二个p标签

            <span>span拼接</span>

        </p>

        <p class="three">第三个p标签</p>

        <p class="four">第四个p标签</p>

    </div>

    <div id="222">

        <div id="no1"><a href="">第一个div</a></div>

        <div id="no2">第二个div</div>

        <div id="no3">第三个div</div>

        <div id="no4">第四个div</div>

    </div>

    <div id="333">

        <table cellspacing="1" cellpadding="5">

            <tr>

                <td>11</td>

                <td>11</td>

            </tr>

            <tr>

                <td>22</td>

                <td>22</td>

            </tr>

            <tr>

                <td>33</td>

                <td>33</td>

            </tr>

            <tr>

                <td>44</td>

                <td>44</td>

            </tr>

        </table>

    </div>

</body>

js:

<script type="text/javascript">

/*

 jquery 14种标签选择器

 */

$(function(){

    //一： id选择器：为标签元素设置一个id，并用#id去空值元素

    //$('#no2').css('color','blue');

    //二： class选择器

    //$('.four').css('color','blue');

    //三：标签选择器 : 多种标签可混合中间以“,”隔开

    //$('p,div').css('color','red');

    //四：任意组合选择：

    //$('p.first,div#no2').css('color','red');

    //$('.second,#no3').css('color','red');

    //五：指定父元素下所有子元素

    //$('#111 span').css('color','red');

    //六：prev + next : 匹配所有紧接在 prev 元素后的 next 元素:只能是两个紧接的元素可用。中间有隔开都无效。

    //$('h1+div').css('color','red');

    //七：prev ~ siblings : 匹配 prev 元素之后的所有 siblings 同辈元素

    //$('h1~div').css('color','red');

    //八：获取标签第一个元素

    //$("p:first").css('color','red');

    //九：last : 获取最后个元素

    //$("div:last").css('color','red');

    //十：even : 匹配所有索引值为偶数的元素，从 0 开始计数

    //$("tr:even").css('color','red');

    //十一：odd : 匹配所有索引值为奇数的元素，从 0 开始计数

    //$("tr:odd").css('color','blue');

    //十二：除去给定选择器的所有元素

    //$("p:not(.three)").css('color','red');

    //十三：gt(index) : 匹配所有大于\等于、小于给定索引值的元素

    /*

    $("p:gt(1)").css('color','red');

    $("p:eq(1)").css('color','green');

    $("p:lt(1)").css('color','blue');

    */

    //十四：匹配所有：*

    $("*").css('color','blue');

});

</script>

jQuery 十三中选择器总结的更多相关文章

  1. 原生js实现jquery库中选择器的功能（jquery库封装一）

    今天是2017.1.1,新的一天,新的一年,新的一年里继续夯实基础知识,在工作中多些项目,多思考,多总结,前端是不断更新,在更新的过程中也是发现乐趣和挑战自我的过程,希望年轻的我和年轻的javascr ...

  2. jQuery基础之选择器

    摘自:http://www.cnblogs.com/webmoon/p/3169360.html jQuery基础之选择器 选择器是jQuery的根基,在jQuery中,对事件处理.遍历DOM和Aja ...

  3. jQuery 简单过滤选择器

    <!DOCTYPE HTML> <html> <head> <title> 使用jQuery基本过滤选择器 </title> <scr ...

  4. 23、jQuery九类选择器/jQuery常用Method-API/jQuery常用Event-API

      1)掌握jQuery九类选择器及应用 2)掌握jQuery常用Method-API 3)掌握jQuery常用Event-API 一)jQuery九类选择器[参见jQueryAPI.chm手册] 目 ...

  5. jQuery基础知识--选择器与效果

    $(this).hide()-----隐藏当前元素 $("p").hide()------隐藏所有段落 $(".test").hide()--隐藏所有class ...

  6. jQuery的筛选选择器

    基本筛选选择器 很多时候我们不能直接通过基本选择器与层级选择器找到我们想要的元素,为此jQuery提供了一系列的筛选选择器用来更快捷的找到所需的DOM元素.筛选选择器很多都不是CSS的规范,而是jQu ...

  7. JQuery总结：选择器归纳、DOM遍历和事件处理、DOM完全操作和动画 （转）

    JQuery总结:选择器归纳.DOM遍历和事件处理.DOM完全操作和动画 转至元数据结尾 我们后台可能用到的页面一般都是用jquery取值赋值的,发现一片不错的文章 目录 JQuery总结一:选择器归 ...

  8. jquery.validate中使用remote，remote相同值不校验问题解决

    jquery.validate中使用remote, remote相同值不校验问题解决 >>>>>>>>>>>>>>& ...

  9. jQuery简单过滤选择器

    <html xmlns="http://www.w3.org/1999/xhtml"> <head>     <!--jQuery选择器详解 根据所获 ...

  10. jQuery系列 第四章 jQuery框架的选择器

    第四章 jQuery框架的选择器 4.1 jQuery选择器说明 jQuery 最核心的组成部分就是选择器引擎.它完全继承了 CSS 的风格,可以对 DOM 元 素的标签名.属性名.状态等进行快速准确 ...

随机推荐

  1. C#,使用FindWindow和FindWindowEx查找窗体和控件

    函数: // Find Window // 查找窗体 // @para1: 窗体的类名 例如对话框类是"#32770" // @para2: 窗体的标题 例如打开记事本 标题是&q ...

  2. this的指向问题、bind/call/apply改变this指向

    this的指向问题 全局作用域下的this指向 无论是否是严格模式,全局作用域下的this始终指向window 函数内部的this 严格模式下: function test() { 'use stri ...

  3. 累加和为 K 的最长子数组问题

    累加和为 K 的最长子数组问题 作者:Grey 原文地址: 博客园:累加和为 K 的最长子数组问题 CSDN:累加和为 K 的最长子数组问题 题目描述 给定一个整数组成的无序数组 arr,值可能正.可 ...

  4. 阿里云OSS存储前端API上传（签名上传）

    一.创建用户 在阿里云创建用户https://ram.console.aliyun.com/users,并勾选Open API 保存好信息,很重要,返回后就再也找不到了 新增授权(这里视个人情况,需要 ...

  5. 使用kuboard界面管理k8s集群时使用ConfigMap挂载挂载到pod容器中，映射成一个文件夹

    将 ConfigMap 作为一个数据卷(在挂载时不指定数据卷内子路径,需要指定ConfigMap的子路径)挂载到容器,此时 ConfigMap 将映射成一个文件夹,每一个 KEY 是文件夹下的文件名, ...

  6. typescript中对象属性可选属性与只读属性与索引签名

    可选属性 type类型别名 type 会给一个类型起个新名字. type 有时和 interface 很像,但是可以作用于原始值(基本类型),联合类型,元组以及其它任何你需要手写的类型. interf ...

  7. Qemu/Limbo/KVM镜像 最精简Linux+Wine，可运行Windows软件，内存占用不到70M，存储占用500M

    镜像特征: Alpine Edge系统 内置Wine 7.8,可运行大量Windows 软件 高度精简,内存占用仅68MB,存储占用仅500MB 完全开源 镜像说明: 用户名为root,密码为空格. ...

  8. Codeforces Round #709 Div2

    就ac了一题.QAQ掉分了我好难过. A题要画图推出来公式. B不会,现在没看到好懂得题解. C题,思路错了,给一些数,每天只能选其中一些,每个数不能被选超过k次,应该先将每天只能选一个得这个数先选上 ...

  9. 洛谷P4197 Peaks （Kruskal重构树）

    读题,只经过困难值小于等于x的路径,容易想到用Kruskal重构树:又要查询第k高的山峰,我们选择用主席树求解. 先做一棵重构树,跑一遍dfs,重构树中每一个非叶子节点对应一段区间,我们开range[ ...

  10. .NET 5 设计 API (资源站)

    跟新于 2022-11日 数据抓取端 随着数据的增多,问题也越来越多 用redis 主要是为了 以后进行,多个数据库写入. 例如我搭建一个 别的数据库论坛,我直接拿数据去redis里面拿,就不用跨库查 ...