<<< Jquery查找元素、选择器使用方法总结
$("#myDiv"); //根据给定的ID匹配一个元素,用于搜索id 属性中给定的值,id属性必须是唯一的
$("div"); //根据给定的元素名匹配所有元素,搜索指向dom节点的标签名
$(".myClass"); //根据给定的类匹配元素,用以搜索的类。一个元素可以有多个类,只要有一个符合就能被匹配到
$("div,.myClass"); //将每一个选择器匹配到的元素合并后一起返回,可以指定多个元素
返回示例:
<div>this is div</div> <p class=".myClass">指定类</p> 结果: <div>div</div>,<p class=".myClass"></p>
$("form input");或者$("div input"); //在给定的父元素元素下匹配所有的子元素
$("div > input"); //给定的父元素下匹配所有的子元素
<div>
<label>id</label>
<input name="name" />
<ul>
<li>Newsletter:</li>
</ul>
</div>
<input name="none" />
结果:
<input name="name" />
$('li:first'); //获取li下面的第一个元素
$('li:last'); //获取li下面的最后一个元素
$("input:not(:checked)")或者$("div:not(a)"); //排除掉input所有选中的元素筛选,排除掉div下的所有a标签
$("li:even"); //匹配所有索引值为偶数的元素,从 0 开始计数
例:
<ul>
<li>第一个</li>
<li>第二个</li>
<li>第三个</li>
<li>第四个</li>
</ul>
结果:
<li>第一个</li>,<li>第三个</li>
$("li:odd"); //匹配所有索引值为奇数的元素,从 0 开始计数,与上面例子相反
$("li:eq(1)"); //匹配给定索引值的元素,从0开始计数,拿上面例子,返回结果为<li>第二个</li>
$("li:gt(0)")和$("li:lt(2)"); //第一个查找所有大于给定索引值的元素,第二个所有小于给定索引值的元素
例:
<ul>
<li>第一个</li>
<li>第二个</li>
<li>第三个</li>
<li>第四个</li>
</ul>
第一个返回结果:
所有大于给定索引值的元素:<li>第二个</li>,<li>第三个</li>,<li>第四个</li>
第二个返回结果:
所有小于给定索引值的元素:<li>第一个</li>,<li>第二个</li>,<li>第三个</li>
$(".myClass").css("background", "#EEE"); //给类名myClass的所有元素加背景颜色
$("#myId:focus"); //给id名为myId设置焦点
$("div:contains('sevennight')"); //查找所有div下包含sevennight的元素
$("div:has(p)").addClass("test");给所有包含 p 元素的 div 元素添加一个 text 类
$("td:parent"); //查找所有含有子元素或者文本的 td 元素
$("div:hidden"); //查找隐藏的 div,或者type为hidden的元素
$("div:visible"); //查找所有的可见div元素
$("input[name='myOption']").attr("checked", true); //查找input所有input标签name等于myOption的属性checked为true的元素
$("input[name!='myOption']").attr("checked", true); //查找input所有input标签name不等于myOption的属性checked为true的元素
$("input[name^='seven']"); //查找input name以seven开始的元素,<input name="sevennight" />, <input name="sevenDay" />
$("input[name$='day']"); //查找input name以day结尾的元素,与上面相反
$("input[name*='a']"); //查找所有input name包含a的元素
$("input['.myClass'][name$='over']"); //查找class名为myClass的元素,并且此元素name以over结尾
$("input:checked"); //查找所有选中的复选框,单选框
$("select option:selected"); //查找option所有选中的选项元素
<<< Jquery查找元素、选择器使用方法总结的更多相关文章
- 简单物联网:外网访问内网路由器下树莓派Flask服务器
最近做一个小东西,大概过程就是想在教室,宿舍控制实验室的一些设备. 已经在树莓上搭了一个轻量的flask服务器,在实验室的路由器下,任何设备都是可以访问的:但是有一些限制条件,比如我想在宿舍控制我种花 ...
- 利用ssh反向代理以及autossh实现从外网连接内网服务器
前言 最近遇到这样一个问题,我在实验室架设了一台服务器,给师弟或者小伙伴练习Linux用,然后平时在实验室这边直接连接是没有问题的,都是内网嘛.但是回到宿舍问题出来了,使用校园网的童鞋还是能连接上,使 ...
- 外网访问内网Docker容器
外网访问内网Docker容器 本地安装了Docker容器,只能在局域网内访问,怎样从外网也能访问本地Docker容器? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Docker容器 ...
- 外网访问内网SpringBoot
外网访问内网SpringBoot 本地安装了SpringBoot,只能在局域网内访问,怎样从外网也能访问本地SpringBoot? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装Java 1 ...
- 外网访问内网Elasticsearch WEB
外网访问内网Elasticsearch WEB 本地安装了Elasticsearch,只能在局域网内访问其WEB,怎样从外网也能访问本地Elasticsearch? 本文将介绍具体的实现步骤. 1. ...
- 怎样从外网访问内网Rails
外网访问内网Rails 本地安装了Rails,只能在局域网内访问,怎样从外网也能访问本地Rails? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Rails 默认安装的Rails端口 ...
- 怎样从外网访问内网Memcached数据库
外网访问内网Memcached数据库 本地安装了Memcached数据库,只能在局域网内访问,怎样从外网也能访问本地Memcached数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装 ...
- 怎样从外网访问内网CouchDB数据库
外网访问内网CouchDB数据库 本地安装了CouchDB数据库,只能在局域网内访问,怎样从外网也能访问本地CouchDB数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Cou ...
- 怎样从外网访问内网DB2数据库
外网访问内网DB2数据库 本地安装了DB2数据库,只能在局域网内访问,怎样从外网也能访问本地DB2数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动DB2数据库 默认安装的DB2 ...
- 怎样从外网访问内网OpenLDAP数据库
外网访问内网OpenLDAP数据库 本地安装了OpenLDAP数据库,只能在局域网内访问,怎样从外网也能访问本地OpenLDAP数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动 ...
随机推荐
- Linux SendMail服务启动慢总结
在 CentOS release 6.6 上启动sendmail服务时发现服务启动过程非常慢,基本上要耗费3分多钟.有点纳闷:什么原因导致sendmail启动这么慢?搜索了这方面的一些资料,结合自己的 ...
- jstorm集群部署
jstorm集群部署下载 Install JStorm Take jstorm-0.9.6.zip as an example unzip jstorm-0.9.6.1.zip vi ~/.bashr ...
- 理解 Cinder 架构 - 每天5分钟玩转 OpenStack(45)
从本节开始我们学习 OpenStack 的 Block Storage Service,Cinder 理解 Block Storage 操作系统获得存储空间的方式一般有两种: 通过某种协议(SAS,S ...
- nodejs缓冲模块buffer相关资料
buffer模块的详细使用教程 浅析nodejs的buffer类 深入浅出NodeJS--Buffer Node Buffer/Stream 内存策略分析
- sk_buff 里的len, data_len, skb_headlen
http://blog.csdn.net/kakadiablo/article/details/7948414 struct sk_buff *skb; skb->len 是data长度,包含所 ...
- TJ2016 CTF Write up
No zuo no die. Use markdown to write writeup in the future......
- JS入门学习,写一个简单的图片库
<!-- 新手刚开始学JS,每天坚持写点东西 坚持下去,希望能有所进步 . 加油~~ --> <!DOCTYPE html> ...
- 【Python数据分析】Python3多线程并发网络爬虫-以豆瓣图书Top250为例
基于上两篇文章的工作 [Python数据分析]Python3操作Excel-以豆瓣图书Top250为例 [Python数据分析]Python3操作Excel(二) 一些问题的解决与优化 已经正确地实现 ...
- load和get的延迟加载
load和get方法的区别: Session.load/get方法均可以根据指定的实体类和id从数据库读取记录,并返回与之对应的实体对象. 区别在于: 如果未能发现符合条件的记录,get方法返回nul ...
- ASP.NET CORE dotnet run 命令使用debug方式运行
由于我的开发环境比较复杂,每次调试一套项目都要启动好几个VS,比较繁琐,今天决定换一种方式调试,对于不该改动的代码的附加项目直接使用dotnet run命令以debug的运行方式运行, 一开始无法运行 ...