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- ...
随机推荐
- 07.centos7构建 IntelliJ IDEA(简称IDEA)开发环境
一.安装IDEA 进入官网下载linux版的社区便,IDEA分为社区版和旗舰版,社区版免费,并且基本满足spark开发需求. 解压安装 目录为/opt/idea 注意:centos命令行界面下是无法安 ...
- 用go实现简单的冒泡排序
package main import "fmt" func main(){ var arr = [] int { 9 , 6 , 2 , 5 , 8 , 10 , 12 , 1 ...
- SQL基于时间的盲注过程
0x00 前言 由于要使用到基于时间的盲注,但是我觉得基于时间的盲注其实就是基于布尔的盲注的升级版,所以我想顺便把基于布尔的盲注分析总结了: 首先我觉得基于时间的盲注和基于布尔的盲注的最直观的差别就是 ...
- Python3 图像识别(一)
Infi-chu: http://www.cnblogs.com/Infi-chu/ 一.环境准备: 1.Python3.x(我是用的是Python3.6.5),这个问题不大,只要3.4以上就OK. ...
- Python系列之 迭代器和生成器
很多Python的程序员都会混淆 迭代器 和 生成器 的概念和作用,分不清到底两个有什么区别.今天我们来好好说一说这两个概念. 迭代器(Iterator) Iterator Pattern Itera ...
- (数据科学学习手札55)利用ggthemr来美化ggplot2图像
一.简介 R中的ggplot2是一个非常强大灵活的数据可视化包,熟悉其绘图规则后便可以自由地生成各种可视化图像,但其默认的色彩和样式在很多时候难免有些过于朴素,本文将要介绍的ggthemr包专门针对原 ...
- [agc004D]Teleporter
Description 传送门 Solution 依题意我们可以知道,以2-n为出发点的边和1号节点会构成一课树(不然2-n号节点无法都达到首都). 为了让2-n号节点中,离1号节点的距离<k的 ...
- TCP三次握手和四次挥手以及11种状态
1.三次握手 置位概念:根据TCP的包头字段,存在3个重要的标识ACK.SYN.FIN ACK:表示验证字段 SYN:位数置1,表示建立TCP连接 FIN:位数置1,表示断开TCP连接 三次握手过程说 ...
- asp.net core添加全局异常处理及log4net、Nlog应用
0.目录 整体架构目录:ASP.NET Core分布式项目实战-目录 一.介绍 此篇文章将会介绍项目的全局异常收集以及采用log4net或者NLog记录. 众所周知,一旦自己的项目报错,如果没有进行处 ...
- C#之Lambda不得不说的用法
由于我才开始接触代码的时候遇到循环问题都是用foreach和for,慢慢就成了习惯,不愿意用其他简便的方式,偶然发现lambda能代替循环而且简便了很多.当然我用lambda也不是简便,更多是不用不行 ...