jQuery筛选器常用总结
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>筛选</title>
<script rel="script" src="js/jquery.min.js"></script>
<script rel="script" src="js/vue.min.js"></script>
<style> </style>
</head> <body>
<p>Anna</p>
<p>Jack</p>
<p>Sunny</p>
<p>Anny</p> <ol>
<li>列表项1</li>
<li>列表项<strong>2</strong></li>
<li>列表项3</li>
<li><strong>列</strong>表项<strong>4</strong></li>
</ol> <em>wind</em>
<em class="weather">snow</em>
<em>sunny</em> <ul>
<li>1</li>
<li>2
<ul>
<li>4</li>
<li>6</li>
<li>5</li>
</ul>
</li>
<li>3</li>
<li>4</li>
</ul> <script>
1、eq();
$(document).ready(function () {
$("p").eq(1).css({"color":"red"});//正数第二个
$("p").eq(0).css({"color":"green"});//正数第一个
$("p").eq(-1).css({"color":"yellow"});//倒数第一个
$("p").eq(-2).css({"color":"blue"}); //倒数第二个
2、first();
$("li").first().css({"color":"#ff00ff"});//获取第一个元素
3、last();
$("li").last().css({"color":"red"});//获取最后一个元素
4、is();
$("li").click(function() {
var $li = $(this),
isWithTwo = $li.is(function() {//is 筛选器的使用
return $('strong', this).length === 2;//列表项内有两个strong标签的是列表项4
});
if ( isWithTwo ) {
$li.css("border", "1px solid #11dd22");//当当前点击列表项有两个strong标签时就把边框色改为#11dd22
} else {
$li.css("border", "1px solid #647787");//点击列表项时把边框改为#647787.
}
});
5、has();
$('li').has('ul').css('border', '1px solid #f0f');//给含有ul的li加上边框,即只有距离ul很近的li才会被识别到，
// 否则是无法识别到的
6、slice();
//slice(start, [end])使用：
// start:开始选取子集的位置。第一个元素是0.如果是负数，则可以从集合的尾部开始选起。
//end:结束选取自己的位置，如果不指定，则就是本身的结尾。 $("p").slice(0, 1).wrapInner("<i></i>");//第一个p标签文本变为倾斜
});
</script> </body>
</html>
jQuery筛选器常用总结的更多相关文章
- jQuery 筛选器1
jQuery 筛选器1 筛选器1: 在选择器选择的基础上在选择一次 // 当前点击的标签$(this) $(this) // .next() 获取当标签的下一个标签 $(this).next(); / ...
- jQuery 筛选器2
jQuery 筛选器2 // 由于$()只能输入字符串$('#li:eq(1)'),可通过.eq()来传入. // 获取this标签中的指定属性 $(this).eq(1) // 获取第一个元素 $( ...
- jQuery筛选器及对DOM修改（学习笔记）
1.jQuery筛选器 注意:请先在管理Nuget程序包中查找jQuery包,并安装.也可以在jQuery官网下载. 实现: <!DOCTYPE html> <html xmlns= ...
- 【jQuery】jQuery筛选器规则
转载自:http://blog.csdn.net/lijinwei112/article/details/6938134 筛选器中加入变量 var ac = "select_" + ...
- jQuery筛选器及练习
jQuery初识 jQuery是什么? jQuery是一个兼容多浏览器的JavaScript库. jQuery能极大地简化JavaScript编程,它的宗旨就是:"Write less, ...
- jQuery笔记-jQuery筛选器children()详解
jQuery的选择包含两种,一种是选择器,一种是筛选器.筛选器是对选择器选定的jQuery对象做进一步选择. children()是一个筛选器,顾名思义就是筛选孩子,筛选那些符合条件的孩子. 完整的格 ...
- python jQuery筛选器
筛选器:$(this).next() 下一个 $(this).prev 上一个 $(this).parent() 父 $(this).children() 孩 $(th ...
- JQuery筛选器全系列介绍
jQuery提供了强大的选择器让我们获取对象.在这边,我人为地将jQuery选择器分为两大部分:选择对象和筛选条件.选择对象表示要获取什么对象,筛选条件是对获取的对象进行筛选,最终留下符合某些特征的对 ...
- jQuery 筛选器 链式编程操作
$('#i1').next() 下一个标签$('#i1').nextAll() 兄弟标签中,所有下一个标签$('#i1').nextUntil('#ii1') 兄弟标签中,从下一个标签到id为ii1的 ...
随机推荐
- Java对象的浅拷贝和深拷贝&&String类型的赋值
Java中的数据类型分为基本数据类型和引用数据类型.对于这两种数据类型,在进行赋值操作.方法传参或返回值时,会有值传递和引用(地址)传递的差别. 浅拷贝(Shallow Copy): ①对于数据类型是 ...
- maven坐标的获取
网址:https://mvnrepository.com 网站上可以搜索具体的组织或项目关键字,之后复制对应的坐标到pom.xml中.如:
- python-----短信、电话告警
Twilio 1.访问http://twilio.com/并注册.注册了新账户后,你需要验证一个手机号码,短信将发给该号码. 2.Twilio 提供的试用账户包括一个电话号码,它将作为短信的发送者.你 ...
- 2017-2018-2 20165221实验二《Java面向对象程序设计》实验报告
JAVA实验二报告 课程:Java程序设计 姓名:谭笑 学号:20165221 实验时间:2018.4.13--2018.4.15 实验2--1 实验内容 实现百分制成绩转成"优.良.中.及 ...
- Sql server—— for xml path简单用法（可以按照分组把相同组的列中的不同的值，像字符串一样拼接在一起显示在分组之后的列中。）
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAI8AAACWCAIAAABo2EyXAAAKeklEQVR4nO2dy27rNh7G+U7CFIrfZX
- Java9 新特性
Java9中的9个新特性 1. Java 平台级模块系统 2. Linking 3. JShell: 交互式 Java REPL 4. 改进的 Javadoc 5. 集合工厂方法 6. 改进的 Str ...
- 【转】python编写规范——中标软件有限公司测试中心
[转]python编写规范 一.说明 二.内容 1. 代码布局 1.1 缩进 1.2 表达式和语句中的空格 1.3 行的最大长度 1.4 空行... 1.5 编码... 2. 语句... 2.1 标准 ...
- MySQL入门简介（转载）
转载链接:https://www.cnblogs.com/webnote/p/5753996.html MySQL的相关概念介绍 MySQL 为关系型数据库(Relational Database M ...
- 判断HDFS文件是否存在
hadoop判断文件是否存在 在shell中判断一个HDFS目录/文件是否存在 直接看shell代码: hadoop fs -test -e /hdfs_dirif [ $? -ne 0 ]; the ...
- mipi LCD 的CLK时钟频率与显示分辨率及帧率的关系【转】
转自:https://blog.csdn.net/bmw7bmw7/article/details/45876487 我们先来看一个公式:Mipiclock = [ (width+hsync+hfp+ ...