<<< 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 安装并启动 ...
随机推荐
- String.SubString
1理论 String.SubString(int index,int length) index:开始位置,从0开始 length:你要取的子字符串的长度 2实验 string my = &quo ...
- 在Ubuntu上单机安装Hadoop
最近大数据比较火,所以也想学习一下,所以在虚拟机安装Ubuntu Server,然后安装Hadoop. 以下是安装步骤: 1. 安装Java 如果是新机器,默认没有安装java,运行java –ver ...
- 不死僵尸木马lpt7.asp.asp与lpt5.cnzzz.asp的删除方法
1. Dos命令 我们知道Windows下是不能以“aux|prn|con|nul|com1|com2|com3|com4|com5|com6|com7|com8|com9|lpt1|lpt2|lpt ...
- .NET应用架构设计—用户端的防腐层作用及设计
阅读目录: 1.背景介绍 2.SOA架构下的显示端架构腐化 3.有效使用防腐层来隔离碎片服务导致显示端逻辑腐烂 4.剥离服务调用的技术组件让其依赖接口 5.将服务的DTO与显示端的ViewModel之 ...
- Hadoop日常维护系列——Hadoop添加删除节点
添加节点 1.修改host 和普通的datanode一样.添加namenode的ip 2.修改namenode的配置文件conf/slaves 添加新增节点的ip或host 3.在新节点的 ...
- stl之截取:以一段字符串截取字符串
string dforder = line.substr(0,line.find("\t")).c_str(); 解析: line为传进来的string类型 substr查找第0位 ...
- 支持+-*/()int 型数据的计算机c++实现
#include <iostream> #include<sstream> using namespace std; template<typename T> cl ...
- 【Python数据分析】Python3操作Excel-以豆瓣图书Top250为例
本文利用Python3爬虫抓取豆瓣图书Top250,并利用xlwt模块将其存储至excel文件,图片下载到相应目录.旨在进行更多的爬虫实践练习以及模块学习. 工具 1.Python 3.5 2.Bea ...
- Log4j简单学习笔记
log4j结构图: 结构图展现出了log4j的主结构.logger:表示记录器,即数据来源:appender:输出源,即输出方式(如:控制台.文件...)layout:输出布局 Logger机滤器:常 ...
- [转有改动]vi
转自http://www.51testing.com/html/86/427686-247344.html 多按几次[ESC],系统会发出滴滴声以确定进入命令模式.就进入了命令模式,所有在键盘上打的字 ...