<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
<meta charset="utf-8" />
    <script src="jquery-3.3.1.js"></script>
    <script>
        $(function () {
            $('#btn').click(function () {
                //所有ul中的第一个li
                //$('ul li:first-child').css('backgroundColor', 'yellow');
                //$('ul li:last-child').css('backgroundColor', 'yellow');
                
                //$('ul li:first').css('backgroundColor', 'yellow');
                //$('ul li:last').css('backgroundColor', 'yellow');
            })
        })
    </script>
</head>
<body>
    <input type="button" name="name" value="btn" id="btn"/>
    <ul>
        <li>香蕉</li>
        <li>西瓜</li>
        <li>苹果</li>
        <li>桔子</li>
        <li>橙子</li>
    </ul>
    <hr color="gray"/>

    <ul>
        <li>篮球</li>
        <li>排球</li>
        <li>足球</li>
        <li>羽毛球</li>
        <li>乒乓球</li>
    </ul>
</body>
</html>

jquery子元素过滤器的更多相关文章

  1. jQuery编程基础精华02（属性、表单过滤器，元素的each，表单选择器，子元素过滤器(*)，追加方法，节点，样式操作）

    属性.表单过滤器 属性过滤选择器: $("div[id]")选取有id属性的<div> $("div[title=test]")选取title属性为 ...

  2. 子元素过滤器nth-child解释

    jQuery中的子元素过滤器nth-child是指:选取每个父元素下的第index个子元素或者奇偶元素(index从1算起) 这里有几点要注意: 1. index 从1开始算 2. 过滤器filter ...

  3. jQuery——子元素筛选器

    子元素筛选器 名称 :first-child JQ语法 jQuery( "selector:first-child" ) 说明 :first-child选择器用于匹配作为父元素的第 ...

  4. 一个样例看清楚JQuery子元素选择器children()和find()的差别

    近期在我们的hybrid app项目开发中定位出了一个问题.通过这个问题了解下JQuery选择器find()和children()的差别.问题是这种:我们的混合app是一个单页面应用(main.htm ...

  5. jquery 子元素筛选选择器

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

  6. jquery 子元素 后代元素 兄弟元素 相邻元素

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

  7. jquery子元素选择器

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. jQuery 子元素选择

    对于如下代码片段  如何对河meishi这个div的子DIV呢? <div id="vertical-Menu-meishi" class="J-nav-item& ...

  9. jquery子元素过滤选择器

    :nth-child('索引值')//获取指定元素下的某个子元素的位置,索引从1开始: //偶数行                 //$('li:nth-child(even)').addClass ...

随机推荐

  1. mysqldump备份脚本

    #!/bin/bash # 10 23 * * * /bin/bash /data/script/backup_mysqldump.sh BDATE=`date +%Y%m%d%H%M%S`BPATH ...

  2. css3-2 CSS3选择器和文本字体样式

    css3-2   CSS3选择器和文本字体样式 一.总结 一句话总结:是要记下来的,记下来可以省很多事. 1.css的基本选择器中的:first-letter和:first-line是什么意思? :f ...

  3. Android 调整透明度的图片查看器

    本文以实例讲解了基于Android的可以调整透明度的图片查看器实现方法,具体如下:  main.xml部分代码如下: <?xml version="1.0" encoding ...

  4. Android学习Scroller(三)——控件平移划过屏幕 (Scroller简单使用)

    MainActivity例如以下: package cc.cn; import android.os.Bundle; import android.view.View; import android. ...

  5. 【b302】侦探推理

    Time Limit: 1 second Memory Limit: 50 MB [问题描述] 明明同学最近迷上了侦探漫画<柯南>并沉醉于推理游戏之中,于是他召集了一群同学玩推理游戏.游戏 ...

  6. Docker for Windows 安装

    原文:Docker for Windows 安装 前言: 环境:windows10专业版 64位 正文: 官方下载地址:https://hub.docker.com/editions/communit ...

  7. Swift下CoreData的使用

    我之前的随笔中有写过一些iOS持久化存储的方法,包含了sqlite.解归档.沙盒存放等等.这些方式中,能够大规模存储,并保持性能的只有使用sqlite了.而这里将记录下Cocoa自身继承的数据库的存储 ...

  8. 使用Akka、Kafka和ElasticSearch等构建分析引擎 -- good

    本文翻译自Building Analytics Engine Using Akka, Kafka & ElasticSearch,已获得原作者Satendra Kumar和网站授权. 在这篇文 ...

  9. yii2框架学习一 yii安装与常见问题

    1 安装安装有两种  cpmposer 喝归档文件 安装  这里采用的归档文件安装    归档文件安装分为两种 基础末班和高级模板,这里采用高级模板  在官网或者yii-china 下载归档文件  解 ...

  10. WPF 高性能笔

    原文:WPF 高性能笔 本文告诉大家WPF的INK的实现,和如何做一个高性能的笔. 高性能的笔迹在 WPF 包含两个部分,一个是就是输入,第二个就是渲染. 如果需要经过路由事件才收到输入,如果有人在路 ...