【JQuery】：first和：last过滤选择器

最新推荐文章于 2021-06-03 10:15:46 发布
最新推荐文章于 2021-06-03 10:15:46 发布
阅读量336 收藏
点赞数
分类专栏： jQuery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/happyhaojie/article/details/50999804
版权

从这一篇开始讲过滤选择器。（吐槽：jQuery乱七八糟的选择器真的非常多，恼火！但是以后用处应该很大）

言归正传，：first的作用是选择一组相同元素的第一个元素。:last选择器的作用刚好相反。

例子：

  <body>
        <div>改变最后一行"苹果"背景颜色：</div>
        <ol>
            <li>葡萄</li>
            <li>香蕉</li>
            <li>橘子</li>
            <li>西瓜</li>
            <li>苹果</li>
        </ol>
        
        <script type="text/javascript">
            $("li:last").css("background-color", "red");
        </script>
    </body>



badlyForPapers
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
jQuery 遍历 -过滤 first(), last() 和 eq()
Yueqin0512的博客
07-14 177
用于过滤筛选某些特定的元素或类而显示的效果 jQuery first() 方法 first() 方法返回被选元素的首个元素。 <script> $(document).ready(function(){ $("div p").first().css("background-color","yellow"); }); </script> <body> <h1>欢迎来到我的主页</h1> <div> <p>这是 di
jQuery first（）、last（）
weixin_44540993的博客
06-18 278
jQuery first（）、last（） -~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 开发工具与关键技术：vs· jQuery基础 作者： 熊 强 撰写时间：2019/6/16 -~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ jQuery 过滤是指 缩小 搜索元素的范围 下面 我来演示 过滤中的jquery first（）和...
jQuery选择器--:first和:last
anqi771129的博客
12-02 236
:first 概述 获取匹配的第一个元素 :last 概述 获取匹配的最后个元素 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script type="text/javascrip...
jQuery first（）和last（）函数示例
从零开始的教程世界
07-14 807
In the last jQuery tutorial, we look into some of the tree traversing functions for parent and child elements. Today we will look into two of the simple traversing functions – first() and last(). 在上一个...
jQuery中的筛选（六）：first()、last()、has()、is()、find()、siblings()等
五彩世界的博客
07-19 1623
&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;筛选&lt;/title&gt; &lt;meta http-equiv="content-type" content="text/h
jQuery中:last-child选择器用法实例
10-24
在jQuery中，`:last-child`选择器是一种非常实用的...通过熟练掌握`:last-child`以及其他类似的选择器，如`:first-child`、`:nth-child(n)`等，你可以编写出更加优雅和高效的jQuery代码，提高网页的交互性和用户体验。
jQuery基本过滤选择器用法示例
10-21
在给定的示例中，我们看到多个基本过滤选择器的使用，它们分别是`:first`、`:last`、`:not`、`:even`、`:odd`、`:eq`、`:gt`以及`:lt`。下面将详细介绍这些选择器的功能和用法。 1. **`:first`**：这个选择器用于...
JQuery选择器、过滤器大整理
10-24
以下是一些基本的jQuery选择器： 1. **基本选择器**：`$()` 函数可以直接接收一个CSS选择器，如 `$("#myID")` 选取ID为`myID`的元素，`$(".myClass")` 选取具有类`myClass`的所有元素，`$("tagname")` 选取所有`tag...
jquery选择器之基本过滤选择器详解
10-26
这些基本过滤选择器是jQuery强大功能的基石，它们可以帮助开发者快速准确地定位到需要操作的DOM元素，从而实现更加高效和简洁的页面交互。了解并熟练掌握这些选择器，对于提升jQuery编码效率和页面性能具有重要意义...
jQuery子元素过滤选择器用法示例
10-21
主要介绍了jQuery子元素过滤选择器用法,结合实例形式分析了jQuery中nth-child、first-child、last-child、only-child等进行子元素过滤操作的相关技巧,需要的朋友可以参考下
Jquery(7)-过滤选择器(1)
04-29 169
jquey006.html --> 我们的新域名为：ycku.com 我们的旧域名为：yc60.com 列表1 列表2 列表3 列表4 列表5 列表6 列表1
选择器的使用(first-child和last-child选择器)
weixin_33962923的博客
10-07 142
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <style...
html中怎样选择第几个,CSS选取第几个标签元素：first-child、last-child、nth-child
weixin_30316931的博客
06-03 3555
1、first-childfirst-child表示选择列表中的第一个标签。代码如下：li:first-child{background:#090}上面的意思是，li 列表中的 第一个li模块的背景颜色。2、last-childlast-child表示选择列表中的最后一个标签，代码如下：li:last-child{background:#090}3、nth-child(3)表示选择列表中的第3个标...
jQuery中 :first 和 :last 选择器诡异问题
Java仗剑走天涯
06-17 2456
jQuery中 :first 和 :last 选择器诡异问题 last作用有效次数问题
jQuery中的基本过滤选择器（四、三）：:first、:last、:not() ... ...
五彩世界的博客
07-17 4090
&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;基本过滤选择器&lt;/title&gt; &lt;meta http-equiv="content-type" content="text/html; charset=UTF-8"&gt; &lt;script type="
jQuery过滤选择器(first,last/:eq()/:contains()/:has()/:hidden/:visible)
yeyang123的专栏
07-16 3000
1、first、last过滤选择器 得到一组相同标签元素中的第1个元素， $(“li:first”) 例：最后一个元素背景色取红色 :first过滤选择器 改变最后一行"苹果"背景颜色： 葡萄 香蕉
【JQuery】下拉列表框的change事件
热门推荐
O(∩_∩)O
04-02 2万+
当一个元素的值发生变化时，将会触发change事件。 例如在选择下拉列表框中的选项时，就会触change事件。 其实很好理解，但是我在写程序的过程中，却发现了另外的问题。 下拉列表的change事件 葡萄 苹果 荔枝 香焦
【JQuery】页面加载时触发ready()事件
O(∩_∩)O
04-02 1万+
从现在开始进入JQuery的事件和应用了！ 好了，言归正传！ ready()类似于onload(). 但ready()只要页面的DOM结构(文档结构)加载后便触发！不包括图片等非文字媒体文件. onload()需要页面的全部元素加载完后才触发！ ready()的使用方式有以下几种. 法一： $(document).ready(function(){do somethi
【补充知识点】e.target指代什么？
O(∩_∩)O
06-06 5008
e.target是目标对象， e.event是目标所发生的事件。 圣诞主题 选择页面： 1 2 3
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值