jQuery之过滤选择器
在原有选择器匹配的元素中进一步进行过滤的选择器
* 基本
* 内容
* 可见性
* 属性
需求
1. 选择第一个div
2. 选择最后一个class为box的元素
3. 选择所有class属性不为box的div
4. 选择第二个和第三个li元素
5. 选择内容为BBBBB的li
6. 选择隐藏的li
7. 选择有title属性的li元素
8. 选择所有属性title为hello的li元素
<div id="div1" class="box">class为box的div1</div>
<div id="div2" class="box">class为box的div2</div>
<div id="div3">div3</div>
<span class="box">class为box的span</span>
<br/>
<ul>
<li>AAAAA</li>
<li title="hello">BBBBB</li>
<li class="box">CCCCC</li>
<li title="hello">DDDDDD</li>
<li title="two">BBBBB</li>
<li style="display:none">我本来是隐藏的</li>
</ul>
实现
$("div:first").css("background","blue")
// 2. 选择最后一个class为box的元素
$("div:last").css("background","blue")
// 3. 选择所有class属性不为box的div
$("div:not(.box)").css("background","blue") // 4. 选择第二个和第三个li元素
$("li:gt(0):lt(2)").css("background","blue") 不是一起的,是从左到右的,选完一个得到的值从新划基准去选择
// 5. 选择内容为BBBBB的li
$("li:contains('BBBBB')").css("background","blue")
// 6. 选择隐藏的li
console.log($("li:hidden").length,$("li:hidden")[0])
// 7. 选择有title属性的li元素
$("li[title]").css("background","blue")
// 8. 选择所有属性title为hello的li元素
$("li[title='hello']").css("background","blue")
jQuery之过滤选择器的更多相关文章
- jQuery 简单过滤选择器
<!DOCTYPE HTML> <html> <head> <title> 使用jQuery基本过滤选择器 </title> <scr ...
- jQuery简单过滤选择器
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <!--jQuery选择器详解 根据所获 ...
- jQuery基本过滤选择器
jQuery基本过滤选择器: <h1>this is h1</h1> <div id="p1"> <h2>this is h2< ...
- Jquery的过滤选择器分为哪几种?
Jquery的过滤选择器分为哪几种? 转载▼ 标签: jquery 过滤选择器 分类 分类: JQuery 所有的过滤选择器分为哪几种: 一.基本过滤选择器(重点掌握下列八个) :first 选取第一 ...
- 第一百六十五节,jQuery,过滤选择器
jQuery,过滤选择器 学习要点: 1.基本过滤器 2.内容过滤器 3.可见性过滤器 4.子元素过滤器 5.其他方法 过滤选择器简称:过滤器.它其实也是一种选择器,而这种选择器类似与 CSS3 (h ...
- jquery :checked(过滤选择器) 和 空格:checked(后代选择器)
jquery 过滤选择器 和 后代选择器 <%@ page language="java" contentType="text/html; charset=UTF- ...
- JQuery 可见性过滤选择器
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- JQuery 内容过滤选择器
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- jQuery内容过滤选择器与子元素过滤选择器用法实例分析
jQuery选择器内容过滤 一.:contains(text) 选择器::contains(text)描述:匹配包含给定文本的元素返回值:元素集合 示例: ? 1 2 $("div.mini ...
- jquery :checked(过滤选择器) 和 空格:checked(后代选择器)【转】
jquery 过滤选择器 和 后代选择器 <%@ page language="java" contentType="text/html; charset=UTF- ...
随机推荐
- 树莓3B+_安装vim
第一步:访问源列表里的每个网址,并读取软件列表,然后保存在本地电脑. sudo apt-get update 第二步:安装vim sudo apt-get install vim 第三步:配置vim ...
- ubuntu软件安装
介绍常用的ubuntu软件及其安装 首先声明,本人在以下的操作全部基于腾讯云16.04版本ubuntu,若版本不一,有些出入,遇到问题可以在楼下留言. ubuntu中文官网 汉化终端 下载中文包 su ...
- 初识spark
一. spark 概述 1.是什么: Apache Spark 是专为大规模数据处理而设计的快速通用的计算引擎.2012年,它是由加州伯克利大学AMP实 验室开源的类 Hadoop MapRedu ...
- CRLF注入学习
预备 <CRLF>是换行符,CRLF注入顾名思义就是把换行符写入,那么要把换行符写入到哪里呢?看看下面的http头 可以看到,每一行都包含特定的头部信息,然后以换行为标志写入其他的头部信息 ...
- Python3 透明网桥算法
import time #定义网桥1 b1 = {} port_list1 = [1, 2] #主机列表 L1 = ['a','b','c'] L2 = ['d','e'] L = [L1,L2] d ...
- 将python自动转换为.exe文件
使用py2exe包进行转换.py2exe怎么装的可以网上另查.时间久了,记不太清了...... 这个程序可以把自己进行转换.但是没法运行....其实只要是需要修改自身的程序打包后都没法运行. # -* ...
- 20155304 2016-2017-2 《Java程序设计》实验三 敏捷开发与XP实践
实验三 敏捷开发与XP实践 实验内容 XP基础 XP核心实践 相关工具 实验步骤 (一)敏捷开发与XP 软件工程是把系统的.有序的.可量化的方法应用到软件的开发.运营和维护上的过程.软件工程包括下列领 ...
- underscore.js 分析 第三天
// Create a safe reference to the Underscore object for use below. // 为Underscore对象创建一个安全的引用 // _为一个 ...
- log4net始终占用日志文件的问题
在appender 下面加 <lockingModel type="log4net.Appender.FileAppender+MinimalLock" />
- ubuntn 安装软件
安装输入法 一.Ctrl+Alt+T打开终端,输入sudo apt-get install fcitx,安装fcitx插件. 二.打开input method,选择fcitx. 三.打开system ...