前端学习之三——jquery选择器
Jquery中的选择器分为几大类:基本过滤选择器,层次选择器,内容过滤选择器,可见性过滤选择器,属性过滤选择器,子元素过滤选择器,表单对象选择器和表单对象属相过滤选择器。
1.非基本过滤选择器,一般需要和基本过滤选择器搭配使用。
2,从性能上将,原声支持的Id选择器,标签选择器,类选择器性能最好,其他一般是通过dom循环查找得到,因此,允许的条件下,优先选择js原生支持的js原生选择器。
3,最好提供选择器的上下文,来缩小目标元素的查找范围。
一、基本选择器。
#id;.class;element;*;selector1,selector2,...selectorN(将每一个选择器匹配到的元素合并后一起返回)
二、层次选择器
$("ancestor descendant"); 选取后代元素;
$("parent>child"); 选取子元素;
$("selector").next();选取紧接着的下一个同辈元素;
$("selector").nextAll() 选取之后的所有同辈元素;
$("selector").siblings() 选取之前及之后的所有同辈元素;
$("selector").prev() 获取之前的同辈元素
$("selector").parents() 获取祖先元素
$("selector").parent() 获取父元素
$("selector").closet() 获取最近匹配的祖先元素
以后几个层次型的查找函数,都可以使用选择器作为函数参数
三、基本过滤选择器
:first;:last;:even;:odd;:eq(index);:gt(index);:lt(index); 按照同一类元素的下标进行选择
:not(selector);:header;:animated;:focus::parent;按照元素的状态进行选择
四、内容过滤选择器
:empty;:contains(key);
:has(seletor)符合某种选择器特征的元素
:find(seletor)符合某种选择器特征的后代元素
:filter(seltor)符合某种选择器特征的同辈元素
五:可见性过滤选择器
:hidden;:visible
六、属性过滤选择器
[attribute];[attribute=value];[attribute!=value];[attribute^=value];[attribute$=value];[attribute*=value];[attribute|=value];[attribute~=value];[attribute1][attribute2]...[attributeN]
七:子元素过滤选择器
:nth-child(index/even/odd);:first-child;last-child;:only-child;
八:表单元素选择器
:input;:text;:password;:radio;:checkbox;:submit;:image;:reset;:button;:file;
九:表单元素属性过滤选择器
:enabled;:disabled;:checked;:selected;
前端学习之三——jquery选择器的更多相关文章
- 前端学习之jquery
前端学习之jquery 1. 什么是jQuery对象? jQuery对象就是通过jQuery包装DOM对象后产生的对象.jQuery对象是jQuery独有的.如果一个对象是jQuery对象,那么它 ...
- 前端学习之jquery/下
前端学习之jquery 一 属性操作 html(): console.log($("div").html()); $(".test").html("& ...
- jQuery基础学习(二)—jQuery选择器
一.jQuery基本选择器 1.CSS选择器 在学习jQuery选择器之前,先介绍一下之前学过的CSS选择器. 选择器 语法 描述 示例 标签选择器 E { ...
- 第四篇 前端学习之JQuery基础
一 jQuery是什么? jQuery就是一个JavaScript的库. <1> jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多 javascript高手加入 ...
- 4月10日学习笔记——jQuery选择器
概念 jQuery 是一套Javascript脚本库,注意 jQuery 是脚本库,而不是脚本框架."库"不等于"框架".jQuery 并不能帮助我们解决脚本的 ...
- 前端学习之jquery(二)
操作元素(属性,css,文档处理) 1.1 属性操作 --------------------------属性 $("").attr(); $("").remo ...
- web前端学习总结--JQuery
jQuery 什么是jQuery jQuery是一个优秀的JavaScript框架,一个轻量级的JS库. 它封装了JS.CSS.DOM,提供了一致的.简洁的API. 兼容CSS3,及各种浏览器 使用户 ...
- 前端学习之-- Jquery
Jquery学习笔记 中文参考文档:http://jquery.cuishifeng.cn Jquery是一个包含DOM/BOM/JavaScript的类库引入jquery文件方法:<scrip ...
- jQuery 学习(2)——jQuery选择器
1.jQuery为元素添加CSS样式如下: <div id="tt1">单个样式:css()内"属性名称","value"< ...
随机推荐
- CSS(下)
目录 CSS(下) CSS属性相关 宽和高 字体属性 背景属性 边框 border-radius display属性 CSS盒子模型 margin外边距 padding内填充 浮动(float) 限制 ...
- 如何用纯 CSS 创作出平滑的层叠海浪特效
效果预览 在线演示 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/JvmBdE 可交互视频教 ...
- python网络爬虫(4)结构与基本概念
基本模型 请求与响应 import urllib.request as urllib2 request=urllib2.Request('http://www.zhihu.com') response ...
- c# 不让窗体显示在alt tab中
protected override CreateParams CreateParams { get { const int WS_EX_APPWINDOW = 0x40000; const int ...
- 10 Python之文件操作
1.文件操作 f = open(文件路径, mode="模式", encoding="编码") f: 文件句柄 文件的路径: 相对路径 相对于当前程序所在的文件 ...
- WebSocket的兼容性
https://github.com/sockjs/sockjs-client https://socket.io/ https://github.com/gimite/web-socket-js h ...
- mySql 的常用命令
一.数据库操作 1.创建数据库 create database <数据库名>: -- 例如,创建test数据库,create database test; 2.查询所有的数据库 show ...
- ubuntu - 如何以root身份使用图形界面管理文件?
nautilus 是gnome的文件管理器,但是如果不是root账号下,权限受限,我们可以通过以下方式以root权限使用! 一,快捷键“ctrl+alt+t”,调出shell. 二,在shell中输入 ...
- Delphi 数组与记录类型
- 生成大量插入语句,并将语句写入txt文件中
import java.io.*; /** * Created by czz on 2019/9/23. */ public class TTest { /** * 生成大量插入语句,并将语句写入tx ...