JQuery Custom Selector

It's strictly a custom pseudo-class selector, but it's also pretty interesting.
Yesterday when I learned one of the jquery lazy load source, I saw it written at the end.

/* Custom selectors for your convenience. Provide a custom choice for your convenience. */
/* Use as $ ("Img:below-the-fold"). something () or translate: You can do this using $ ("Img:below-the-fold"). something () or/
/* $ ("img"). Filter (": Below-the-fold"). something () which is faster translation: $ ("img"). Filter (": Below-the-fold"). Something () It's faster.
A simple translation of the following do not know the exact.
$.extend ($.expr[":"], {
"Below-the-fold": function (a) {return $.belowthefold (A, {threshold:0});
"Above-the-top": function (a) {return!$.belowthefold (A, {threshold:0});
"Right-of-screen": function (a) {return $.rightoffold (A, {threshold:0});
"Left-of-screen": function (a) {return!$.rightoffold (A, {threshold:0});
"In-viewport": function (a) {return $.inviewport (A, {threshold:0});
/* Maintain BC for couple of versions. */
"Above-the-fold": function (a) {return!$.belowthefold (A, {threshold:0});
"Right-of-fold": function (a) {return $.rightoffold (A, {threshold:0});
"Left-of-fold": function (a) {return!$.rightoffold (A, {threshold:0});}
});

It's magical to say that there are wood.
Although there have been simple to see the jQuery source, but the Sizzle selector engine Part I skip directly, so I did not notice this piece of functionality.
Out of curiosity, of course, to learn how to customize the selector.

Turned Baidu Google, only to find a reliable Chinese blog. Looks like this thing is really unpopular ah. It's really not necessary to think it over.
But it's always good to learn a lot with the goal of learning.
You can see this article, "jquery custom Selector jquery customization Selector"

Basic format:

$.expr[': '].test = function (obj, index, meta, stack) {
/* Obj-is A current DOM element
Index-the the index in the stack of the current loop index in stack,
Meta-meta data about your selector!!! Used to save parameter values, as detailed in the custom selector with parameters.
Stack-stack the set of elements selected by the all elements to loop selector.

Returns true to include the current element
return False to Explude the current element returns false to discard the present elements
*/
};

Call Method:

$ ('. Someclasses:test '). dosomething ();

Call with parameter:

$ ('. Someclasses:test (argument) '). DoSomething ();
$ ('. Someclasses:test ("arg1, arg2")). DoSomething ();
$ (". Someclasses:test (' arg1, arg2 ')"). DoSomething ();

Do you remember the meta argument just now?
For example, call this:

$ ('. Someclasses:test (argument) '). DoSomething ();

Meta will get an array of the following formats:

[
': Test (argument) ',//full selector entire custom selector
' Test ',//Only selector custom selector name
",///Quotes used use quotes (obviously not here)
' argument '//Parameters Parameters
]

For example, call:

$ ('. Someclasses:test ("arg1, arg2")). DoSomething ();

Meta will get an array of the following formats:

[
': Test ("arg1, arg2") ',//full selector whole custom selector
' Test ',//Only selector custom selector name
' "',///Quotes used use quotes (double quotes here)
' Arg1, arg2 '//Parameters Parameters
]

Let's write a simple selector as an exercise.
Just write a just that selector, with parameters good.

$ ("a:test (haha)");

The custom selector code is:

$.expr[': '].test = function (obj, index, meta, stack) {
var txt = obj.innerhtml,
key = Meta[3];
return Txt.indexof (Key) >-1;
};
Test
$ (' #navList a:test (JavaScript) '). each (function () {
Console.log (this.innerhtml);
});

Click on the right side to run to see.

There's no technical content, but it's really an interesting technique.