zoukankan      html  css  js  c++  java
  • jQuery Custom Selector JQuery自定义选择器

    什么是JQuery的选择器呢,详见JQuery中的Selector: http://docs.jquery.com/Selectors

    比如 $("div:contains('John')").css("text-decoration", "underline");的contains选择器等等

    JQuery自定义选择器的基本语法:

    $.expr[':'].test = function(obj, index, meta, stack){
    /* obj - is a current DOM element
    index - the current loop index in stack
    meta - meta data about your selector !!! 用来存参数值,详见带参数的自定义选择器。
    stack - stack of all elements to loop

    Return true to include current element
    Return false to explude current element
    */
    };

    // Usage:

    $('.someClasses:test').doSomething();
    1.创建一个简单的自定义选择器(将返回"rel"标签不为空的元素)

    $.expr[':'].withRel = function(obj){

    var $this = $(obj);

    return ($this.attr('rel') != '');

    };

    // 应用:

    $('a:withRel').css('background-color', 'yellow');

    效果见:http://custom-drupal.com/jquery-demo/custom-selectors/

    2. 创建带参数的自定义选择器,通过meta来实现.
    语法:
    $('a:test(argument)');

    //meta would carry the following info: meta的格式如下(meta[3]对应的值是argument)

    [

    ':test(argument)', // full selector

    'test', // only selector

    '', // quotes used

    'argument' // parameters

    ]

    $('a:test("arg1, arg2")');

    //meta would carry the following info:

    [

    ':test('arg1, arg2')', // full selector

    'test', // only selector

    '"', // quotes used

    'arg1, arg2' // parameters

    ]

    实例:


    $.expr[':'].withAttr = function(obj, index, meta, stack){

    return ($(obj).attr(meta[3]) != '');

    };

    应用:
    $('a:withAttr(rel)').css('background-color', 'yellow');

  • 相关阅读:
    GridView
    母版页
    Ajax完整结构和删除
    Ajax1
    JQuery动画
    JQuery基础
    LinQ高级查询
    C#简单的学籍管理系统(数据库变更由原来的SQLserver改为SqLite)
    C#两个数只能进行+1,-1,*2操作。求使得两个数相等的最小步骤
    C#求最小公倍数与最大公约数
  • 原文地址:https://www.cnblogs.com/axl234/p/3877989.html
Copyright © 2011-2022 走看看