jq取第一个子元素为select_【转】jquery如何获取第一个或最后一个子元素?

【转自】https://www.cnblogs.com/MUMO/p/5938483.html

通过children方法,children("input:first-child")

$(``this``).children(``"input:first-child"``).val();

$(``this``).children(``"input:last-child"``).val();

通过>选择器,$(".items>input:first")

在这里转一篇《jQuery选择元素的方法大全》

1. 先说说通过位置选择的几个操作:

:first:默认情况下是相对整个页面来说的第一个,如:li:first表示整个页面的第一个li元素,而ul li:first表示整个页面的第一个li元素,并且是在ul下的子元素;

:last:同上了,只是是最后一个而已;

:first- child:为每个父元素匹配第一个子元素,如li:first-child返回每个ul的第一个li元素。可以这样理解,页面中的元素有相同的父元素 的,并且里面又包含li元素的,那么就取第一个li元素,每个子类集合都要进行判断,直到找出所有符合要求的li元素;

:last-child:这个也与上面相对了,只是取的是最后一个;

:only-child:返回所有没有兄弟节点的元素,注意,文本元素不是,也就是说类似这样的

hellojquery
,对于这段会选出元素;对 于$(” label:only-child“)会选出是label元素,同时它是它父类唯一的子元素的label元素;

:nth-child(n):返回第n个子节点,n从1开始,如果n取0,那么就会选择所有的元素。如:[*]li:nth-child(2)返回li元素,并且该元素是其父元素的第二个子元素;

:nth-child(even|odd):返回偶数或奇数的子节点;

:nth-child(An+B):返回满足表达式An+B的所有子节点,比如3n+1返回所处位置为父节点子元素的是3的倍数加1的那个子元素;

:even:页面范围内的处于偶数位置的元素,如:li:even返回全部偶数li元素;

:odd:页面范围内的处于奇数位置的元素;

:eq(n):第n个匹配的元素(n从0开始),如:li:eq(3)返回整个页面的第四个li元素,ul li:eq(1)返回页面中第一个ul元素下的第二个li元素,注意:只匹配一次就返回了;

:gt(n):第n个匹配元素(不包括)之后的元素(n从0开始),如:ul:gt(2)返回从第3个ul开始的所有ul元素(含第三个);

:lt(n):第n个匹配元素(不包括)之前的元素(n从0开始),如:ul:lt(2)返回从第0个和第1个ul元素;

2. 利用css选择器进行选择:

元素标签名:比如说$(”a“)会选出所有链接元素;

"#id":通过元素id进行选择,比如说$("#form1")会选择id为form1的元素;

.class:通过元素的CSS类来选择,比如说$(".boldstyle")会选择CSS为boldstyle类的元素;

标签 名#id.class:通过某类元素的id属性和class属性来选择,如:$(a#blog.boldStyle)会选择id为blog并且CSS类型 为.boldStyle类型的链接元素(

父标签名 子标签名.class:通过选择父标签下的某种CSS类型的子元素,如:$(p a.redStyle)会选择p段落元素中的链接子元素a,且其css类型为.redStyle;

3. 通过子选择器,容器选择器和属性选择器进行选择:

:匹配所有的元素,比如说:$()会把页面中的所有元素都返回;

E:匹配标签名为E的所有元素,如$("a")返回所有链接元素;

E F:匹配父元素E下的标签名为F的所有子元素(F可以为E的子类的子类,甚至更远);

E>F:匹配父元素E下的所有标签名为F的直接子元素;

E+F:匹配所有

标签名为F的元素,并且有E类型的兄弟节点在该F元素之前(E,F紧挨着);

E~F:匹配前面是任何兄弟节点E的所有元素F(E,F不必紧挨着);

E:has(F):匹配标签名为E,至少有一个标签名为F的后代节点的所有元素E;

E.C:匹配带有类名C的所有元素E。.C等效于.C;

E#I:匹配id为I的所有元素E,#I等效于#I;

E[A]:匹配带有属性A的所有元素E;

E[A=V]:匹配所有属性A的值为V的元素E;

E[A^=V]:匹配所有元素E,且A的属性值是V开头的;

E[A$=V]:匹配所有元素E,且A的属性值是V结尾的;

E[A*=V]:匹配所有元素E,且A的属性值中包含有V;

4.利用jQuery自定义的选择器进行选择:

:button:选择任何

按钮 类型的元素,包括input[type=submit]等等;

:checkbox:选择复选框元素;

:file:选择所有文件类型元素,即input[type=file];

:image:选择表单中的图像元素,即input[type=image],注意此处和前面根据

img 选择图像有点不同哈;

:input:选择表单元素,如,,,等;

:

radio :选择单选按钮元素;

:reset:选择复位按钮元素,如input[type=reset],button[type=reset];

:submit:选择提交按钮元素;

:text:选择文本字段元素,即input[type=text];

:animated:选择当前处于动态控制下的元素;

:contains(hello):选择包含文本hello的元素;

:header:选择标题元素,如

:parent:选择拥有后代节点(包括文本)的元素,而排除空元素;

:selected:选择已选中的选项元素;

:visible:选择可见元素;

:enable:选择界面上已经可以使用的表单元素;

:disabled:选择界面上被禁用的

表单 元素;

:checked:选择已选中的复选框或单选

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/291908.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

基于ASP.NET Core SignalR的流式传输

基于ASP.NET Core SignalR的流式传输SignalR概述SignalR是ASP.NET Core下非常流行的实现Web实时功能的库。微软再文档中列出了适合的应用场景:适合 SignalR 的候选项:需要从服务器进行高频率更新的应用。示例包括游戏、社交网络、投票、拍卖、地图和 GPS…

Leetcode: Palindrome Partition I II

题目一, 题目二 思路 1. 第一遍做时就参考别人的, 现在又忘记了 做的时候使用的是二维动态规划, 超时加超内存 2. 只当 string 左部分是回文的时候才有可能减少 cut 3. 一维动规. 令 cuts[i] 表示string[i, string.size()] 所需的切割数, 那么 状态转移方程为 cuts[i] min(cut…

FatMouse

时间限制:1 秒 内存限制:128 兆 特殊判题:否 提交:1431 解决:641 题目描述:FatMouse prepared M pounds of cat food, ready to trade with the cats guarding the warehouse containing his favorite food…

linux之安装Clion和运行使用总结

前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。点击跳转到教程 1、Clion的简单介绍 CLion是以IntelliJ为基础,专为开发C及C++所设计的跨平台IDE,可以在Windows、Linux及MacOS使用,这里我是在ubuntu 16.0.4基础上安装。 2、linux平台…

Tips

1.Unity\Editor\Data\Resources\ScriptTemplates 里的文件是Unity 生成文件的模板. 2.提示文件尾不一致.用VS打开Unity\Editor\Data\Resources\ScriptTemplates里的模板文件.文件->高级保存选项->Windows(CRLF) 3.Scene视图里选择Transform工具,按V可以通过Pivot对齐 4.N…

体验 正式发布 的OSM v1.0.0 版本

2021年10月份发布了OSM 1.0 RC[1],在过去的几个月里,OSM 的贡献者一直在努力为 v1.0.0 版本的发布做准备。2022年2月1日,OSM 团队正式发布 1.0.0 版本[2]。OSM 从最初的发布到现在已经走了很长的路,团队继续专注于社区需要的关键和…

linux c之用命名管道实现进程通信

1、命名管道相关信息介绍 不是很了解命名管道先看这个篇博客 http://blog.csdn.net/u011068702/article/details/55102379 linux c之命名管道简单使用 博客介绍了创建管道的方法,这里还需要介绍 open函数和调用阻塞 FIFO文件也可以使用open调用来打开,mkfifo函数只是创建…

vue表格刷新数据_Vue.js+Layer表格数据绑定与实现更新的实例

一:先使用Vue.js绑定好数据与更新事件使用v-on绑定好事件,在事件里边直接把该行数据传递进去,在更新方法里边就可以直接取出需要更新的数据选择用户名学号班级操作{{item.UserName}}{{item.Number}}{{item.Class}}删除更新//实例化vue.js(用来给表格提供…

数据流图的画法

数据流图的画法 数据流图也称为数据流程图date flow diagram , DFD,是一种便于用户理解和分析系统数据流程的图形工具,他摆脱了系统和详细内容,精确的在逻辑上描写叙述系统的功能、输入、输出和数据存储等,是系统逻辑模型的重要组…

linux之自己总结学习linux的资源推荐

1、学习linux前辈的网站 安卓和linux网络编程 http://www.cnblogs.com/hnrainll/ IBM学习linux技术地址: https://www.ibm.com/developerworks/cn/views/linux/libraryview.jsp 2、学习linux的途径,或者说过程 1、APUE再深读 – 尤其是进程,线程,IPC,套接字 2、 多…

01-算法简介

数据结构和算法 基于《算法图解》—Aditya Bhargava和《数据结构》—严蔚敏 ** 算法图解:(基于Python)* 第1章—算法简介 1.1 引言 算法是一组完成任务的指令。 1.2 二分查找(binary_search) 二分查找是一种算法,其输入是一个…

浏览器渲染机制面试_【前端面试必考题】页面渲染机制(一)

页面渲染机制这部分内容会分成两篇来进行讲解,这两篇里我们准备聊一下页面的渲染的过程,包括页面的加载、DOM 树的构建、CSSOM 树的构建、渲染树的构建和最后的渲染过程等。浏览器的渲染机制和网页的优化息息相关,只有知道了页面是怎么渲染出…

OpenJudge/Poj 1226 Substrings

1.链接地址: http://bailian.openjudge.cn/practice/1226/ http://poj.org/problem?id1226 2.题目: 总时间限制:1000ms内存限制:65536kB描述You are given a number of case-sensitive strings of alphabetic characters, find the largest string X, s…

MFC继承表

转载于:https://www.cnblogs.com/Lthis/p/4264967.html

linux之fdisk查看分区和mkfs.ext3删除分区和mount挂载和e2label添加卷标使用总结

一、使用fdisk、mkfs.ext3、和mount、e2lable的原因 有个分区挂载不上,然后需要格式化分区,还需要添加卷标 二、fdisk、mkfs.ext3、mount、e2lable命令介绍 1、fdisk命令介绍 1)、了解分区 分区是将一个硬盘驱动器分成若干个逻辑驱动器,分区是把硬盘连续的区块当做一个…

Task+ConcurrentQueue多线程编程

队列&#xff08;Queue&#xff09;代表了一个先进先出的对象集合。当您需要对各项进行先进先出的访问时&#xff0c;则使用队列。当您在列表中添加一项&#xff0c;称为入队&#xff0c;当您从列表中移除一项时&#xff0c;称为出队。ConcurrentQueue<T>队列是一个高效的…

怎样从一个手机上安两个不同版本的软件_怎么在一部手机上安装两个不同版本的微信?...

今天我们就向大家介绍一个非常简便的方法&#xff0c;帮助我们实现在Android智能手机将应用程序多开。1、安卓微信双卡方法&#xff1a;准备工作从上图我们可以看到&#xff0c;小编在自己的手机上已经安装了两个不同版本的微信。通常在自己的手机上安装同一应用程序时&#xf…

牛人的英语学习方法

牛人的英语学习方法&#xff1a; 总结1&#xff1a;背出来的单词 不背熟单词就去学所谓的听力阅读作文语法&#xff0c;就像没学走路就想学跑步&#xff0c;没吃饭就想拉屎&#xff0c;没脱牛仔裤就想脱内裤一样的痴心妄想。所以想学英语的人要做的第一件事&#xff0c;不是哭&…

02-选择排序

数据结构和算法 基于《算法图解》—Aditya Bhargava和《数据结构》—严蔚敏 第2章 2.1 内存的工作原理 计算机就像是很多抽屉的集合体&#xff0c;每个抽屉都有地址。需要将数据存储到内存是&#xff0c;请求计算机提供存储空间&#xff0c;计算机则分配一个地址。需要存储多…

[SAP ABAP开发技术总结]权限对象检查

20.14. 权限检查 AT SELECTION-SCREEN. DATA: BEGIN OF lt_bukrs OCCURS 0, bukrs TYPE t001-bukrs, END OF lt_bukrs. SELECT bukrs FROM t001 INTO CORRESPONDING FIELDS OF TABLE lt_bukrs WHERE bukrs IN s_bukrs. LOOP AT lt_bukrs. AUTHORITY-C…