说的简单,:first表示单个元素,:fisrt-child表示的多个元素(集合)。

如果追求深一点的话,

1.$(:first).css()表示全局或局部全局的第一个,也就是表示单个元素

2.$(:first-child).css表示该元素上一级父级元素,的同类元素下的该元素,表示的同一个元素的集合

举一个简单里子测试吧:

    <script>
        $(function(){
            $('ul li:first').css('background','gray')
        })
    </script>
    <body>
        <div class="list">
            <ul>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
            </ul>
            <ul>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
            </ul>
        </div>

显示效果:

如果该为first-child测试,代码和效果如下:

            $('ul li:first-child').css('background','gray');

另外在遍历中有first(),没有first-child

:first与:first-child的区别的更多相关文章

  1. jQuery学习笔记(一)jQuery选择器

    目录 jQuery选择器的优点 基本选择器 层次选择器 过滤选择器 表单选择器 第一次写博客,希望自己能够长期坚持,以写博客的方式作为总结与复习. 最近一段时间开始学习jQuery,通过写一个jQue ...

  2. jQuery笔记(一)jQuery选择器

    一.前言 编写任何javascript程序我们要首先获得对象, jQuery选择器能彻底改变我们平时获取对象的方式, 可以获取几乎任何语意的对象, 比如"拥有title属性并且值中包含tes ...

  3. child和childNodes的区别

    child和childNodes区别: childNodes是标准属性, child是非标准属性 childNodes: 获取节点,不同浏览器表现不同 IE 只获取元素节点 非IE 获取元素节点和文本 ...

  4. python Parent.__init()和super(Child, self)的区别

    super函数做的事情 def supper(cls, inst): mro = inst.__class__.mro() return mro[mro.index(cls) + 1] inst生成父 ...

  5. MapReduce剖析笔记之七:Child子进程处理Map和Reduce任务的主要流程

    在上一节我们分析了TaskTracker如何对JobTracker分配过来的任务进行初始化,并创建各类JVM启动所需的信息,最终创建JVM的整个过程,本节我们继续来看,JVM启动后,执行的是Child ...

  6. [转]ExtJs基础--Html DOM、Ext Element及Component三者之间的区别

    要学习及应用好Ext框架,必须需要理解Html DOM.Ext Element及Component三者之间的区别. 每一个HTML页面都有一个层次分明的DOM树模型,浏览器中的所有内容都有相应的DOM ...

  7. height:100%与height:inherit的区别

    一.兼容性 首先,inherit这个属性只是在ie8+才支持:100%支持ie6: 二.大多数情况下没有区别 在正常情况下height:100%与height:inherit没有任何区别: 1.父元素 ...

  8. [ASP.NET MVC 小牛之路]12 - Section、Partial View 和 Child Action

    概括的讲,View中的内容可以分为静态和动态两部分.静态内容一般是html元素,而动态内容指的是在应用程序运行的时候动态创建的内容.给View添加动态内容的方式可归纳为下面几种: Inline cod ...

  9. MVC与WebForm的区别

    在初步了解MVC后,发现很多人对于MVC和三层架构开发概念上会有很大的混淆,所以把这两天的学习笔记整理一下,分享给自己的同学们.同时也做一个小Demo,让没有接触过MVC开发的同学,能对MVC有一个简 ...

  10. ios中@class和 #import区别

    很多刚开始学习iOS开发的同学可能在看别人的代码的时候会发现有部分#import操作写在m文件中,而h文件仅仅使用@class进行声明,不禁纳闷起来,为什么不直接把#import放到h文件中呢?这是因 ...

随机推荐

  1. _jobdu_1002

    /************************************************************************/ /* 题目1002:Grading 时间限制:1 ...

  2. Grunt - 前端开发所见即所得

    首先要安装全局的grunt-cli sudo npm install grunt-cli -g 1,项目中初始化npm文件,项目名不要和[关键词]如grunt重复,一直回车即可 npm init 2, ...

  3. prelaod场景,用来显示资源加载进度

    phaser.js的源码可以到它在github上的托管里去下载,游戏要用到的图片声音等素材资源请点击这里下载.Phaser的使用非常简单,只需要引入它的主文件,然后在页面中指定一个用来放置canvas ...

  4. redis之如何配置jedisPool参数

      JedisPool的配置参数很大程度上依赖于实际应用需求.软硬件能力,JedisPool的配置参数大部分是由JedisPoolConfig的对应项来赋值的.   maxActive:控制一个poo ...

  5. JavaScript系列:replace()函数(第二个参数为函数)

    语法 stringobject.replace(regexp/substr,replacement) 只讲解这个:参数replacement为函数时,这个参数函数的参数代表的意义,以及运行次数,及过程 ...

  6. CSS与JavaScript文件的位置

    1.CSS 尽量放置在head标签中. 原因: 避免浏览器重新渲染: 避免阻塞JS文件的执行. 注:CSS选择器的解释顺序是 从右向左 的,所以尽量减少选择器的层级. 2.JS 尽量放置在</b ...

  7. CodeForces 625B 字符串模拟+思维

    题意 给出字符串a与b 可以将a中的单个字符改为# 问最少改多少次 a中就找不到b了 一开始想的是用strstr 因为如果找到 可以将strstr(a,b)-a+1改成# 即改首字母 用while循环 ...

  8. [IT思考]技术领先对手多少算好?

    坦白讲,很多做技术的公司,总是觉得技术越“牛”越好.但是,历史也曾经出现过,很多公司技术的确很棒,但是市场反响一般(待补充案例).结果可想而知. 要知道,每一个新技术,尤其是业界领先的新技术,需要不少 ...

  9. [项目机会]citrix 虚拟桌面对于java等高CPU占用率如何解决

    citrix 虚拟桌面对于java等高CPU占用率如何解决 问题1:java等客户端对于虚拟桌面cpu影响较大,但是有些用户的确需要使用java支持的程序,是否可以通过其他途径来解决? 问题2:对于其 ...

  10. Ubuntu下设置中文字符集支持(解决中文乱码问题)

    一. Ubuntu默认的中文字符编码 Ubuntu默认的中文字符编码为zh_CN.UTF-8,这个可以在/etc/environment中看到: sudo gedit /etc/environment ...