有两种创建伪类的方法,

第一种

$.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]的更多相关文章

  1. (五)CSS伪类(Pseudo-class)

    CSS伪类用于向某些选择器添加特殊的效果.伪类的语法如下: selector : pseudo-class {property: value} CSS类也可以与伪类搭配使用: selector.cla ...

  2. 关于伪类“:pseudo-class”和伪元素“::pseudo-element”的常见应用

    伪类用于指定要选择的元素的特殊状态,向其添加特殊的效果,比如: input { width: 515px; height: 50px; padding: 10px 20px; border: 1px ...

  3. sizzle分析记录: 自定义伪类选择器

    可见性 :hidden :visible 隐藏对象没有宽高,前提是用display:none处理的 jQuery.expr.filters.hidden = function( elem ) { // ...

  4. jquery自定义类的封装

    如何用jquery自定义一个类?(demo参考) /*简单使用*/ (function($){ //el操纵对象,option属性值 $.love = function(el,option){ var ...

  5. css伪类伪元素

    在CSS中,模式(pattern)匹配规则决定哪种样式规则应用于文档树(document tree)的哪个元素.这些模式叫着选择符(selector). 一条CSS规则(rule)是选择符{属性:值; ...

  6. 解密jQuery内核 Sizzle引擎筛选器 - 位置伪类(一)

    本章开始分析过滤器,根据API的顺序来 主要涉及的知识点 jQuery的组成 pushStack方法的作用 sizzle伪类选择器 首页我们知道jQuery对象是一个数组对象 内部结构 jQuery的 ...

  7. jquery 文字向上滚动+CSS伪类before和after的应用

    汇总常用技巧——CSS伪类before和after的应用 先上效果图,建议遵循有图有真相的原则,可以上图的地方,还望不要嫌麻烦,毕竟有图的话 可以让读者少花些时间! <!DOCTYPE html ...

  8. jQuery过滤选择器:first和:first-child的区别,CSS伪类:first-child

    最近项目中遇到需求:只在第一列不能删除,不显示小叉号:点击可添加一列,后面的列右上角显示小叉号,可以点击删除. 我是使用以下方法解决这个小需求 :CSS伪类选择器:first-child设置所有小叉号 ...

  9. css hover伪类选择器与JQuery hover()方法

    css hover伪类选择器 它属于anchor伪类 在支持 CSS 的浏览器中,<a>标签链接的不同状态都可以以不同的方式显示,常常用来改链接的颜色效果 实例 a:link {color ...

随机推荐

  1. 分享一个web存储方法

    https://github.com/zhujiasheng/jquery-cookie/blob/master/src/jquery.cookie.js https://github.com/WQT ...

  2. [转载] 深入理解Android之Java虚拟机Dalvik

    本文转载自: http://blog.csdn.net/innost/article/details/50377905 一.背景 这个选题很大,但并不是一开始就有这么高大上的追求.最初之时,只是源于对 ...

  3. HTTP 错误 500.21 - Internal Server Error 处理程序“PageHandlerFactory-Integrated”

    网站发布到IIS上,访问时出现错误 原因:在安装Framework v4.0之后,再启用IIS,导致Framework没有完全安装 解决:开始->所有程序->附件->右键点击“命令提 ...

  4. 简例 一次执行多条mysql insert语句

    package com.demo.kafka;import java.sql.Connection;import java.sql.DriverManager;import java.sql.Prep ...

  5. C语言 断言 总结

    转载: http://wenda.so.com/q/1378817559065638?src=140 assert宏的原型定义在<assert.h>中,其作用是如果它的条件返回错误,则终止 ...

  6. 给div设置background-color: rgba(0, 0, 0, 0.2)属性,并加了css3动画--opacity动画淡出动画,之后div子元素的字体会抖一下

    问题:给div设置background-color: rgba(0, 0, 0, 0.2)属性,并加了css3动画--opacity动画淡出动画,之后div子元素的字体会抖一下: 解决:animati ...

  7. 'autocomplete="off"'在Chrome 中不起作用

    大家都知道autocomplete属性是表单字段中的HTML5新属性,该属性有两种状态值,分别为"on" 和 "off",该属性可省略:省略属性值后默认值为&q ...

  8. python学习之——pip的安装与使用

    安装步骤: 前提:已经安装python 1.下载安装包并解压: easy_install 地址:https://pypi.python.org/pypi/setuptools#downloads pi ...

  9. Python Windows环境下安装Python集成开发环境 学习之路(一)

    一.安装下载安装 Python https://www.python.org/ 全部下一步,直接Finish  PyCharm http://www.jetbrains.com/pycharm/ 全部 ...

  10. flask-admin章节一:使用chartkick画报表

    一般中小型WEB整体来看逻辑比较简单些,一般都是基于数据库的增删改查.不过通过数据库查询到的记录直接展示给用户不是很直观,大家其实蛮期待有一个报表 直接展示他们期待的内容. 这块就涉及到数据的提取和展 ...