jQuery - 自定义伪类 [:pseudoclass]
有两种创建伪类的方法,
第一种,
$.extend( $.expr[':'], {
// 自定义的伪类名称:group
group: function(element, index, matches, set) {
var num = parseInt(matches[3], 10);
if(isNaN(num) {
return false;
}
return index % (num * 2) < num;
}
});
1)、element,当前的 DOM 元素。
2)、index,当前 DOM 元素在结果集中的索引
3)、matches,数组,包含用于解析这个选择符的正则表达式的解析结果。
一般来说,matches[3] 是这个数组中唯一有用的值;假如有一个选择符的形式为":groub(b)",
则 matches[3] 中的值就是 b,也就是括号中的文本。
4)、set,匹配到当前元素的整个 DOM 元素集合
第二种,
$.expr[':'].pointsHigherThan = $.expr.createPseudo(function(filterParam) {
var points = parseInt(filterParam, 10);
return function(element, context, isXml) {
return element.getAttribute('data-points') > points;
}
}
分为三个步骤:
第一步,给自定义过滤器起一个名字,比如 “pointsHigherThan”
第二步,使用 createPseudo(filterParam) 函数创建过滤器对应的匿名函数,filterParam 参数的名字可随便起,
这个参数是一个传给过滤器函数的可选参数。类似于传给过滤器 :eq(n) 的参数 n。
第三步,在过滤器函数中再返回另外一个匿名函数,在这个函数内部编写过滤逻辑代码,最后返回 boolean 值表示是否匹配?
jQuery 传递给此匿名函数三个参数,
element 参数,是一个 DOMElement 元素,一次传递一个。
context 参数,匹配元素的上下文参数
isXML 参数,确定当前操作是在 XML 文档中吗?
示例如下:$('.levels li:pointsHeighThan(20)');
[示例]:
$("tr:group(3)").addClass('alt');
jQuery - 自定义伪类 [:pseudoclass]的更多相关文章
- (五)CSS伪类(Pseudo-class)
CSS伪类用于向某些选择器添加特殊的效果.伪类的语法如下: selector : pseudo-class {property: value} CSS类也可以与伪类搭配使用: selector.cla ...
- 关于伪类“:pseudo-class”和伪元素“::pseudo-element”的常见应用
伪类用于指定要选择的元素的特殊状态,向其添加特殊的效果,比如: input { width: 515px; height: 50px; padding: 10px 20px; border: 1px ...
- sizzle分析记录: 自定义伪类选择器
可见性 :hidden :visible 隐藏对象没有宽高,前提是用display:none处理的 jQuery.expr.filters.hidden = function( elem ) { // ...
- jquery自定义类的封装
如何用jquery自定义一个类?(demo参考) /*简单使用*/ (function($){ //el操纵对象,option属性值 $.love = function(el,option){ var ...
- css伪类伪元素
在CSS中,模式(pattern)匹配规则决定哪种样式规则应用于文档树(document tree)的哪个元素.这些模式叫着选择符(selector). 一条CSS规则(rule)是选择符{属性:值; ...
- 解密jQuery内核 Sizzle引擎筛选器 - 位置伪类(一)
本章开始分析过滤器,根据API的顺序来 主要涉及的知识点 jQuery的组成 pushStack方法的作用 sizzle伪类选择器 首页我们知道jQuery对象是一个数组对象 内部结构 jQuery的 ...
- jquery 文字向上滚动+CSS伪类before和after的应用
汇总常用技巧——CSS伪类before和after的应用 先上效果图,建议遵循有图有真相的原则,可以上图的地方,还望不要嫌麻烦,毕竟有图的话 可以让读者少花些时间! <!DOCTYPE html ...
- jQuery过滤选择器:first和:first-child的区别,CSS伪类:first-child
最近项目中遇到需求:只在第一列不能删除,不显示小叉号:点击可添加一列,后面的列右上角显示小叉号,可以点击删除. 我是使用以下方法解决这个小需求 :CSS伪类选择器:first-child设置所有小叉号 ...
- css hover伪类选择器与JQuery hover()方法
css hover伪类选择器 它属于anchor伪类 在支持 CSS 的浏览器中,<a>标签链接的不同状态都可以以不同的方式显示,常常用来改链接的颜色效果 实例 a:link {color ...
随机推荐
- U-Mail邮件系统六项特色服务铸就金口碑
评价一款邮件系统优劣的标准或许有很多,左右你是否选择某个平台的需求或许有不同,但是U-Mail小编必须提醒你:服务水准不可等闲视之!之所以如此, 这是因为:现代社会垃圾邮件猖獗,病毒层出不穷令人防不胜 ...
- DataGridView控件内建立日期选择编辑列
两个文件: CalendarColumn 类: public class CalendarColumn : DataGridViewColumn { public CalendarColumn() : ...
- java_method_下载导入模版
//调用方法 upDown.download(request, response, request.getRealPath("")+"/output/BlackNumbe ...
- SQL Server Management Studio 2012 设置脚本默认保存路径
特别说明,本文是从这里 修改SQL Server Management Studio默认设置提高开发效率. "抄过来的",为方便个人记忆才写此文(非常感谢这哥们儿的分享.) 原文地 ...
- asp.net程序集冲突解决笔记(未能加载文件或程序集"XXXXXXXXX")
先来看张截图.(未能加载文件或程序集”System.Web.Razor“) 先说一下我的情况.(扯蛋的,解决方法还在下面 —> _ < ) 这是 ASP.NET MVC 的东西.老大写了一 ...
- .Net判断一个对象是否为数值类型探讨总结(高营养含量,含最终代码及跑分)
前一篇发出来后引发了积极的探讨,起到了抛砖引玉效果,感谢大家参与. 吐槽一下:这个问题比其看起来要难得多得多啊. 大家的讨论最终还是没有一个完全正确的答案,不过我根据讨论结果总结了一个差不多算是最终版 ...
- QT5.2.1大BUG
本来以为5.2.1是release版本 谁知道编译某个程序,执行老是crash 换5.3.2就ok了. 坑啊
- bash fifo管道使用测试例子
碰到一个场景: 一个脚本内起了多个后台线程,往一个日志文件写日志,结果因为线程之间争抢写锁,导致脚本执行效率很低,为了解决这个问题,希望减少写锁的争抢,尝试使用fifo解决该问题,以下是实验用例子. ...
- DISK 100% BUSY,谁造成的?
iostat等命令看到的是系统级的统计,如果要追查是哪个进程导致的I/O繁忙,应该怎么办? iostat等命令看到的是系统级的统计,比如下例中我们看到/dev/sdb很忙,如果要追查是哪个进程导致的I ...
- js如何找到方法在哪个js文件
在Console窗口中输入var f = methodA.prototype.constructor;console.log(f); 网络搜索到的方法.