jQuery选择器与事件学习笔记
层次选择器:
$("div li")获取div下的所有li元素(后代、子、子的子......)
$("div>li")获取div下的直接li子元素。
$(".menuitem+div")获取样式名为menuitem之后的第一个div元素(不常用)。
$(".menuitem~div")获取样式名为menuitem之后所有的div元素(不常用)。
基本过滤选择器:
:first选取第一个元素。$("div:first")选取第一个<div>
:last选取最后一个元素。$("div:last")选取最后一个<div>
:not(选择器)选取不满足“选取器”条件的元素。$("input:not(.myClass)")选取样式名不是myClass的<input>
:even、:odd,选取索引是奇数、偶数的元素:$("input:even")选取索引是奇数的<input>
:eq(索引序号)、:gt(索引序号)、:lt(索引序号)选取索引等于、大于、小于、索引序号的元素,比如$("input:lt(5)")选取索引小于5的<input>
$(":header")选取所有的h1......h6元素。
$("div:animated")选取正在执行动画的<div>元素。
属性过滤选择器:
$("div[id]")选取有id属性的<div>
$("div[title=test]")选取title属性为“test”的<div>,JQuery中没有对getElementByName进行封装,用$("input[name=abc]")
$("div[title!=test]")选取title属性不为“test”的<div>
还可以选择开头、结束、包含等,条件还可以复合。
表单对象选择器(过滤器):
$("#form1:eneabled")选取id为form1的表单内所有启用的元素
$("#form1:disabled")选取id为form1的表单内所有禁用的元素
$("input:chedked")选取所有选中的元素(Radio、ChekBox)
$("select:selected")选取所有选中的选项元素(下拉列表)
表单选择器
$(":input")选取所有<input>、<textarea>、<select>和<button>元素,和$("input")不一样,$("input")只获得<input>
$(":text")选取所有单行文本框,等价于$("input[type=text]")
$(":password")选取所有密码框。同理有有::radio、:checkbox、:submit、:image、:reset、:button、:file、:hidden。
节点遍历
next()方法用于获取节点后的挨着第一个同辈元素,
$(".menuitem").next("div")、nextAll方法用于获取节点后的所有同辈元素,
$(".menuitem").nextAll("div")
siblings()方法用于获取所有同辈元素,$(".menuitem").siblings("li")
事件绑定
//执行一次后失效的事件
$(":button").one("click", function (e) {}
//绑定事件
$(":button").bind("click", function (e) {
});
$(":button").bind("click", function (e) {
});
//取消绑定事件
$(":button").unbind("click");
事件对象e:
属性:pageX、pageY、target获得触发事件的元素(冒泡的起始,也就是冒泡的源,和this不一样,this指在哪个控件上监听的那个控件的对象).
which如果是鼠标事件获得按键(1左键,2中键,3右键.
altKey、shiftKey、ctrlKey获得alt、shift、ctrl是否按下,为bool值。keyCode、charCode属性发生时间时的keyCode(键盘码,小键盘的1和主键盘的keyCode不一样)、charCode(ASCII码)。
jQuery选择器与事件学习笔记的更多相关文章
- 《jQuery权威指南》学习笔记之第2章 jQuery选择器
2.1 jQuery选择器概述 2.1.1 什么使选择器 2.1.2 选择器的优势: 代码更简单,完善的检测机制 1.代码更简单 示例2-1 使用javascript实现隔行变色 < ...
- 笔记:FastAdmin 之 jQuery 选择器 $("[name$='[]']", form) 学习
笔记:FastAdmin 之 jQuery 选择器 $("[name$='[]']", form) 学习 $("[name$='[]']", form)这个是什 ...
- C#委托与事件学习笔记
委托事件学习笔记 本文是学习委托和事件的笔记,水平有限,如有错漏之处,还望大神不吝赐教. 什么是委托?从字面意思来解释,就是把一个动作交给别人去执行.在实际开发中最常用的就是使一个方法可以当做一个参数 ...
- 《JS高程》事件学习笔记
事件:文档或浏览器窗口中发生的一些特定的交互瞬间,也即用户或浏览器自身执行的某种动作. -------------------------------------------------------- ...
- 锋利的jQuery第2版学习笔记4、5章
第4章,jQuery中的事件和动画 注意:使用的jQuery版本为1.7.1 jQuery中的事件 JavaScript中通常使用window.onload方法,jQuery中使用$(document ...
- 锋利的jQuery第2版学习笔记1~3章
第1章,认识jQuery 注意:使用的jQuery版本为1.7.1 目前流行的JavaScript库 Prototype(http://www.prototypejs.org),成型早,面向对象的思想 ...
- javascript事件学习笔记
事件冒泡 并不是所有的事件都支持事件冒泡,比如submit ,focus,blur不支持事件冒泡,mouseover,mouseout虽然支持冒泡,但是一般不用,因为需要经常计算元素的位置,消耗比较大 ...
- [jQuery] 选择器和事件
jQuery选择器 属性选择器 <p>p1</p> <span style="font-size:24px;"></span>< ...
- jQuery选择器和事件
选择器 常用事件 绑定与解除绑定 事件目标与冒泡 自定义事件
随机推荐
- CAD安装失败怎样卸载CAD 2010?错误提示某些产品无法安装
AUTODESK系列软件着实令人头疼,安装失败之后不能完全卸载!!!(比如maya,cad,3dsmax等).有时手动删除注册表重装之后还是会出现各种问题,每个版本的C++Runtime和.NET f ...
- Murano py27和py34的兼容处理
tox.ini envlist = py27,py34,pep8 1. django.utils.encoding.force_unicode替换成django.utils.encoding.forc ...
- eclipse中使用自带的git提交项目
1.自带git插件进行配置我们的用户名和密码,即是自己github注册用户.windows--perferences--Team--Git--Configuration 2.eclipse生成SSH2 ...
- XStream xml转java对象2
<?xml version="1.0" encoding="UTF-8" ?> <person> <name>yunyun& ...
- C# 本地文件的上传和下载
本文主要介绍一下,在APS.NET中文件的简单上传于下载,上传是将文件上传到服务器的指定目录下,下载是从存入数据库中的路径,从服务器上下载. 1.上传文件 (1)页面代码 <table alig ...
- 关于docker remote api未授权访问漏洞的学习与研究
漏洞介绍: 该未授权访问漏洞是因为docker remote api可以执行docker命令,从官方文档可以看出,该接口是目的是取代docker 命令界面,通过url操作docker. docker ...
- 《Head First 设计模式》之状态模式——糖果机
状态模式(State) ——允许对象在内部状态时改变它的行为,对象看起来好像修改了它的类. 策略模式与状态模式的区别 状态主体(拥有者)持有状态对象,运行时可以通过动态指定状态对象来改变类的行为 策略 ...
- 正则表达式 \w \d 的相关解读
在查阅很多相关正则的描述之后,发现对于\w 的释义都是指包含大 小写字母数字和下划线 相当于([0-9a-zA-Z]) (取材于经典教程 正则表达式30分钟入门教程) 但是在实际使用中发现并不是这么回 ...
- 织梦上传webp格式图片
织梦cms如何添加其他格式的图片呢? 这里以webp为类来实现一下如何让织梦支持webp 1.修改系统设置让织梦(dede)支持该图片格式,比如:webp(新图片格式) 系统->系统基本参数-& ...
- ASP.NET MVC 音乐商店 - 2.控制器
在典型的 Web 应用中,用户请求的 URL 地址通常映射到保存在网站中的文件上,例如,当用户请求 /Products.aspx 的时候,或者 /Products.php 的时候,很可能是在通过处理 ...