jQuery_01之选择器
1、jQuery对象获取:①先获得DOM对象,再用$函数封装到jQuery对象;var $jQuery=$(DOM对象);②直接使用$函数查找到的DOM对象,被自动封装到jQuery对象中;var $jQuery=$(“selector”);
2、jQuery选择器:支持几乎所有CSS选择器;①绑定:a、DOM:elem.addEventListener(“事件名”,fn);b、jQuery:$(“selector”). 事件名(fn);②修改样式:a、DOM:elem.style.css属性名=值;b、jQuery:$(“selector”). css(“css属性名”,值);
3、选择器:①基本选择器:#id,.class,元素,*(通配符),群组(,);
②层次选择器:a、选择器1(空格)选择器2;b、parent > child;c、前一个兄弟+后一个兄弟;d、前一个兄弟~后面所有兄弟;
4、过滤选择器:
a、基本过滤(位置过滤)::first,:last,:not(selector),:even,:odd,:eq(i),:gt(i),:lt(i);*(* 指定父元素下的子元素:first-child/last-child/nth-child(n););
b、内容过滤::contains(text),:empty(内容为空),:parent(内容非空),:has(selector)(选择含有selector特性子元素的父元素);
c、可见性过滤::visible(所有可见元素),:hidden(所有不可见元素);*( * 设置不可见有4种,display:none,visibility:hidden,opacity:0,type=“hidden”;其中:hidden只能匹配display:none和type=“hidden”;);
d、属性过滤:【属性名】:包含指定属性的元素;【属性名=值】:指定属性指定值的元素;【属性名!=值】:指定属性非指定值的元素;【属性名^值】:指定属性值以指定内容开头的元素;【属性名$=值】:指定属性值以指定内容结尾的元素;【属性名*=值】:指定属性只包含指定内容的元素;【属性选择器1】【属性选择器2】……:同时满足以上属性选择器的元素;
e、子元素过滤::first-child,:last-child,:nth-child(n),:only-child;
5、表单选择器:
a、基本:input(选择所有input,包括textarea,select,button),:text(type为text的元素),:password,:radio,:checkbox,:submit,:reset,:button,:file,:hidden(包括type=“hidden”和display=“none”),:image(选取所有图形按钮);
b、表单属性过滤选择器::enabled(所有可用的元素),:disabled(所有不可用的元素),:checked(被选中的checkbox),:selected(被选中的option);
6、属性:修改:$(“selector”).attr(“标准属性名”,“值”);*(省掉第二个参数为读取属性值);*(*attr只能获取或设置元素开始标签中的attribute,无法获取或设置不再开始标签中的property——可使用prop读取,例:checked属性;);
jQuery_01之选择器的更多相关文章
- 前端极易被误导的css选择器权重计算及css内联样式的妙用技巧
记得大学时候,专业课的网页设计书籍里面讲过css选择器权重的计算:id是100,class是10,html标签是5等等,然后全部加起来的和进行比较... 我只想说:真是误人子弟,害人不浅! 最近,在前 ...
- jQuery的61种选择器
The Write Less , Do More ! jQuery选择器 1. #id : 根据给定的ID匹配一个元素 <p id="myId">这是第一个p标签< ...
- 05.LoT.UI 前后台通用框架分解系列之——漂亮的时间选择器
LOT.UI分解系列汇总:http://www.cnblogs.com/dunitian/p/4822808.html#lotui LoT.UI开源地址如下:https://github.com/du ...
- CSS 选择器及各样式引用方式
Css :层叠样式表 (Cascading Style Sheets),定义了如何显示HTML元素. 目录 1. 选择器的分类:介绍ID.class.元素名称.符合.层次.伪类.属性选择器. 2. 样 ...
- jQuery学习之路(1)-选择器
▓▓▓▓▓▓ 大致介绍 终于开始了我的jQuery学习之路!感觉不能再拖了,要边学习原生JavaScript边学习jQuery jQuery是什么? jQuery是一个快速.简洁的JavaScript ...
- 谈谈一些有趣的CSS题目(十)-- 结构性伪类选择器
开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...
- JQuery 选择器
选择器是JQuery的根基,在JQuery中,对事件的处理,遍历DOM和AJAX操作都依赖于选择器.如果能够熟练地使用选择器,不仅能简化代码,而且还可以事半功倍. JQuery选择器的优势 1.简洁的 ...
- jq选择器基础
Jquery $代表选择器 使用jq必须要导入jq文件 <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js&qu ...
- 微信小程序中利用时间选择器和js无计算实现定时器(将字符串或秒数转换成倒计时)
转载注明出处 改成了一个单独的js文件,并修改代码增加了通用性,点击这里查看 今天写小程序,有一个需求就是用户选择时间,然后我这边就要开始倒计时. 因为小程序的限制,所以直接选用时间选择器作为选择定时 ...
随机推荐
- Java猜拳小游戏(剪刀、石头、布)
1.第一种实现方法,调用Random数据包,直接根据“1.2.3”输出“剪刀.石头.布”.主要用了9条输出判断语句. import java.util.Random; import java.util ...
- eclipse/myeclipse sublime 实时更新文件改变
情形: 在使用eclipse/myeclipse开发的时候, 像JS 或者HTML 以及一些操作时,sublime 的效率比eclipse/myeclipse要快,所以我们就可以使用这两者一起开发. ...
- GCD in Swfit 3.0
这里包括了Queue, Group, Barrier, Semaphore等内容.基本上常用的GCD对象和方法在Swift3.0的改变都囊括其中. 代码在这里:https://github.com/f ...
- col-md-*,col-xs-*
class属性 col-md-*,md 表示 medium (中等的),* 代表一个数字,它指定了这个元素所占的列宽. 在中等大小的屏幕上(例如笔记本电脑),元素的列宽被指定了. col-xs-* , ...
- ubuntu安装hexo博客
ubuntu下安装hexo博客 一 安装git sudo apt-get install git 二 安装nodejs 官网下载linux安装包.tar.gz文件 解压 tar zxvf 这样变可以切 ...
- 03、AngularJs的模块与控制器
大部分的应用程序都有一个主方法(main)来组织,实例化,启动应用程序.而AngularJs应用是没有主方法的,它是通过模块来声明应用应该如何启动的.同时,模块允许声明来描述应用中依赖关系,以及如何进 ...
- websocket---Html5
使用websocket主要是处理,通过服务器向页面发送消息,进行页面操作的处理. 以前类似情况,由于程序立即相应,处理事件较短,所遇采用过ajax进行轮询, 但是由于本次,需要人工干预,所以采用web ...
- Mysql运行SQL文件 错误Incorrect table definition;there can be only one TIMESTAMP column with CURRENT_TIMESTAMP in DEFAULT or ON UPDATE clause
问题描述 想从服务器上DOWN下数据库.操作:先把数据库转存为SQL文件,然后在本地利用navicate运行SQL文件,出现错误信息: Incorrect table definition;there ...
- EventBus的简单使用与原理
一.概述 EventBus是一款针对Android优化的发布/订阅事件总线.主要功能是替代Intent,Handler,BroadCast在Fragment,Activity,Service,线程之间 ...
- iOS集成丁香园DXY OAuth 登陆 swift代码示例
问:iOS集成OAuth登陆分几步? 答:和把大象放冰箱里一样. 第一步:打开webview,跳转到登陆页面: let url = "https://auth.dxy.cn/conn/oau ...