0

0

jquery常用的过滤方法

无忌哥哥

无忌哥哥

发布时间:2018-06-29 11:42:06

|

1689人浏览过

|

来源于php中文网

原创

过滤方法,也就是函数,大多与前面介绍过的过滤器功能是一致的

1:get()将jquery对象转为DOM对象:将第二个文本的前景色设置为红色

$('li').get(1).style.color = 'red'

2.eq():获取指定序号的元素,注意,返回的是jQuery对象

$('li').eq(4).css('color','red')

3.first():返回第一个元素,不需要参数

$('li').first().css('color','red')

4.first():返回最后一个元素,不需要参数

$('li').last().css('color','red')

5.toArray(),返回DOM数组,注意不是jquery对象

var li = $('li').toArray()
for(var i=0; i

6.find():返回所有的后代元素,包括子,孙...

$('ul').find('li').css('color','coral')
$('ul').find('a').css('color','cyan')

7.children()返回所有的直接子元素

$('ul').children().css('color','deeppink')
$('ul').children('p').css('color','deeppink')

8.对每个元素执行回调函数

$('li').each(function(){
$(this).css('background-color','wheat')
$(this).css('color','black')
$(this).css('font-size','1.3em')
})

9.元素遍历方法

//next()下一个同级元素

$('li').eq(2).next().css('color','blue')

//nextAll()后面全部的同级元素

$('li').eq(2).nextAll().css('color','blue')

//siblings():返回所选元素的所有同级元素,除它自己

$('li').eq(2).siblings().css('color','blue')

向前遍历

//prev():前一个同级元素

常用的表格操作方法
常用的表格操作方法

常用的表格操作方法

下载
$('li').removeAttr('style')
$('li').eq(6).prev().css('color','coral')

//prevAll():您一定猜到了,对,是前面的所有同级元素

$('li').eq(6).prevAll().css('color','coral')

10. add(selector),将元素添加到所选的集合中

//先去掉所有元素上面的自定义样式,将元素打回原型,素颜模样

$('*').removeAttr('style')

//将所有li文本设置为红色,你会发现有一个p没有选上,这也正常

$('li').css('color','red')

//那么如何才能选上p元素呢,只有加大选区,把p元素放进这个选区中就可以了

//使用add()方法就可以做到

$('li').add('p').css('color','red')

11. filter()从结果中返回符合条件的元素

//仅仅返回第6个元素

$('li').filter(':eq(5)').css('background-color','lightgreen')

12. not()与filter()功能正好相反,去掉满足条件的元素

$('li').not(':eq(5)').css('background-color','lightgreen')

13. slice(start, end),返回指定范围的元素

$('*').removeAttr('style')

//包括起始位置,不包括结束位置,返回的结果数量是5-2=3

$('li').slice(2,5).css('background-color','lightgreen')

//获取前4个元素

$('li').slice(0,4).css('background-color','lightgreen')

//省略第二个参数,默认从当前开始直到结尾

$('li').slice(4).css('background-color','lightgreen')

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
C++ 设计模式与软件架构
C++ 设计模式与软件架构

本专题深入讲解 C++ 中的常见设计模式与架构优化,包括单例模式、工厂模式、观察者模式、策略模式、命令模式等,结合实际案例展示如何在 C++ 项目中应用这些模式提升代码可维护性与扩展性。通过案例分析,帮助开发者掌握 如何运用设计模式构建高质量的软件架构,提升系统的灵活性与可扩展性。

8

2026.01.30

c++ 字符串格式化
c++ 字符串格式化

本专题整合了c++字符串格式化用法、输出技巧、实践等等内容,阅读专题下面的文章了解更多详细内容。

8

2026.01.30

java 字符串格式化
java 字符串格式化

本专题整合了java如何进行字符串格式化相关教程、使用解析、方法详解等等内容。阅读专题下面的文章了解更多详细教程。

6

2026.01.30

python 字符串格式化
python 字符串格式化

本专题整合了python字符串格式化教程、实践、方法、进阶等等相关内容,阅读专题下面的文章了解更多详细操作。

1

2026.01.30

java入门学习合集
java入门学习合集

本专题整合了java入门学习指南、初学者项目实战、入门到精通等等内容,阅读专题下面的文章了解更多详细学习方法。

20

2026.01.29

java配置环境变量教程合集
java配置环境变量教程合集

本专题整合了java配置环境变量设置、步骤、安装jdk、避免冲突等等相关内容,阅读专题下面的文章了解更多详细操作。

17

2026.01.29

java成品学习网站推荐大全
java成品学习网站推荐大全

本专题整合了java成品网站、在线成品网站源码、源码入口等等相关内容,阅读专题下面的文章了解更多详细推荐内容。

18

2026.01.29

Java字符串处理使用教程合集
Java字符串处理使用教程合集

本专题整合了Java字符串截取、处理、使用、实战等等教程内容,阅读专题下面的文章了解详细操作教程。

3

2026.01.29

Java空对象相关教程合集
Java空对象相关教程合集

本专题整合了Java空对象相关教程,阅读专题下面的文章了解更多详细内容。

6

2026.01.29

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
尚学堂Mahout视频教程
尚学堂Mahout视频教程

共18课时 | 3.2万人学习

jQuery视频教程
jQuery视频教程

共36课时 | 7.8万人学习

jQuery入门基础视频教程
jQuery入门基础视频教程

共29课时 | 6.3万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号