sizzle分析记录: 自定义伪类选择器
可见性
隐藏对象没有宽高,前提是用display:none处理的
jQuery.expr.filters.hidden = function( elem ) {
// Support: Opera <= 12.12
// Opera reports offsetWidths and offsetHeights less than zero on some elements
return elem.offsetWidth <= 0 && elem.offsetHeight <= 0;
};
jQuery.expr.filters.visible = function( elem ) {
return !jQuery.expr.filters.hidden( elem );
};
内容
获取文本内容通过indexOf匹配
"contains": markFunction(function( text ) {
return function( elem ) {
return ( elem.textContent || elem.innerText || getText( elem ) ).indexOf( text ) > -1;
};
}),
取空
递归这个节点,排除nodeType大于6的节点
// Contents
"empty": function( elem ) {
// http://www.w3.org/TR/selectors/#empty-pseudo
// :empty is negated by element (1) or content nodes (text: 3; cdata: 4; entity ref: 5),
// but not by others (comment: 8; processing instruction: 7; etc.)
// nodeType < 6 works because attributes (2) do not appear as children
for ( elem = elem.firstChild; elem; elem = elem.nextSibling ) {
if ( elem.nodeType < 6 ) {
return false;
}
}
return true;
},
查看包含
递归sizzle通过传递上下文对象,实现包含查找
"has": markFunction(function( selector ) {
return function( elem ) {
return Sizzle( selector, elem ).length > 0;
};
}),
匹配含有子元素或者文本的元素
"parent": function( elem ) {
return !Expr.pseudos["empty"]( elem );
},
sizzle分析记录: 自定义伪类选择器的更多相关文章
- 巧用CSS3伪类选择器自定义checkbox和radio的样式
由于原生的checkbox和radio的样式太简陋了,在设计页面的时候,设计师往往会设计自己的checkbox和radio样式.一半情况下,为了适应各个浏览器的兼容性,我们都会用其他的元素替代原生的c ...
- (转)CSS3:nth-child()伪类选择器,奇偶数行自定义样式first-child
原文地址 Table表格奇偶数行定义样式: CSS3的强大,让人惊叹,人们在惊喜之余,又不得不为其艰难的道路感到可惜:好的标准只有得到行业浏览器的良好支持才算得上“标准”.CSS3标 准已提出数年,但 ...
- CSS2伪类选择器要点
有四个选择器,分别是 hover:鼠标悬停 link:链接不能使用时 visited:链接被点击后 active:链接被点击时,如果鼠标不放,就会一直触发active属性 link在w3c中记录为链接 ...
- 【CSS3】---结构性伪类选择器-root+not+empty+target
结构性伪类选择器—root :root选择器,从字面上我们就可以很清楚的理解是根选择器,他的意思就是匹配元素E所在文档的根元素.在HTML文档中,根元素始终是<html>. 示例演示: 通 ...
- css3 巧用结构性伪类选择器
最近在国外的一个网站上看到的一个关于结构性伪类选择器的用法,觉得十分实用,就自己尝试了一下,并把它给记录下来: 这是最基本的样式: <style type="text/css" ...
- H5与CS3权威下.19 选择器(2)结构性伪类选择器
1.CSS中的伪类选择器及伪元素 (1)与自定义的class类选择器不同,伪类选择器是CSS中已经定义好的选择器. eg:a:link{color:#ff0000;} (2)伪元素的使用方法: 选择器 ...
- CSS魔法堂:稍稍深入伪类选择器
前言 过去零零星星地了解和使用:link.::after和content等伪类.伪元素选择器,最近看书时发现这方面有所欠缺,于是决定稍微深入学习一下,以下为伪类部分的整理. 伪类 伪类选择器实质上 ...
- 伪类选择器 E:nth-child(n)、E:nth-of-type(n)
结构伪类是css3新增的类型选择器. E:nth-child(n).E:nth-of-type(n)就是其中之二.搞懂了这两个,基本上跟他俩一家的其他几个兄弟伙基本上也可以弄懂了. 首先先用文字语言来 ...
- python 全栈开发,Day47(行级块级标签,高级选择器,属性选择器,伪类选择器,伪元素选择器,css的继承性和层叠性,层叠性权重相同处理,盒模型,padding,border,margin)
一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body ...
随机推荐
- 亲临现场不是梦,2017央视春晚推出VR直播
自里约奥运会首次试水VR直播 后,用户开始关注这种观影方式,一瞬间VR直播开始流行.就在月初,江苏卫视宣布2017年跨年晚会将进行VR全景直播.当然,央视是绝对不会错过这中潮流方式. 据悉,央视201 ...
- unison+inotify-tools触发式双向自动同步
双向实时数据同步部署 首先添加服务器ssh信任,即免秘钥登陆 Web1:192.168.10.36 Web2:192.168.10.37 分别在web1和web2上执行以下命令 mkdir ~/.ss ...
- NOIP2016普及总结
---恢复内容开始--- 当时我说如果不出意外有385,结果就这么跪在了第二题,惨啊 本来以为发挥算正常,结果这发挥太不正常了 [T1] 水题啊[趴 注意下细节就好考你会不会写代码. [T2] 这题大 ...
- 洛谷 P1378 油滴扩展 Label:搜索
题目描述 在一个长方形框子里,最多有N(0≤N≤6)个相异的点,在其中任何一个点上放一个很小的油滴,那么这个油滴会一直扩展,直到接触到其他油滴或者框子的边界.必须等一个油滴扩展完毕才能放置下一个油滴. ...
- kindeditor-4.1.3工具使用技巧:如何在编辑区上传图片并保存绝对路径
MVC项目开中用到了KindEditor图片上传工具,需要在编辑区内上传图片,并将图片的URL保存为符合如下格式地址,如http://192.168.0.111/uploadImg/imgName.j ...
- 强制 history 不记住特定的命令
使用 HISTCONTROL 强制 history 不记住特定的命令将 HISTCONTROL 设置为 ignorespace,并在不想被记住的命令前面输入一个空格: # export HISTCON ...
- MemCache 启动
这个MemCache在园子里面的文章也很多,这里只是我自己记录作下笔记 MemCache的官方网站为http://memcached.org/ 启动与关闭memCache # /usr/local/m ...
- Webform Application传值 ViewState
Application:所有的会话共享一个Application空间,任何一个人改变Application的内容,其他人都会发现被改变了.Application中的内容不会被自动释放 存放位置:服务端 ...
- pythonchallenge 解谜 Level 8
#-*- coding:utf-8 -*- #代码版本均为python 3.5.1 #Level 7 import bz2 un=b'BZh91AY&SYA\xaf\x82\r\x00\x00 ...
- ThreadLocal对象使用过程中容易陷入的坑
ThreadLocal对象帮助我们管理线程内的对象,保证对象在线程之间是相互隔离的. 今天碰到的坑是这样的: index01.html页面加载的时候会发送一次a请求,然后点击附件上传的时候会发送上传请 ...