slick 自定义 图标

slick 自定义 图标

As I mentioned in my previous post about the Slick selector engine, Create Elements on the Fly with MooTools 1.3 and Slick, Slick is extremely flexible. Part of that flexibility is the ability for you to define custom pseudo class selectors to better gather the elements that meet your needs.

正如我在上一篇关于Slick选择器引擎的文章中提到的那样， 使用MooTools 1.3和Slick快速创建元素 ，Slick非常灵活。 这种灵活性的一部分是使您能够定义自定义伪类选择器，以更好地收集满足您需求的元素的能力。

It all starts with the Slick.definePseudo method; just give Slick.definePseudo the name of your pseudo class selector and a function returning true (matched) or false (not a match).

一切都从Slick.definePseudo方法开始； 只需为Slick.definePseudo提供您的伪类选择器的名称以及一个返回true(匹配)或false(不匹配)的函数。

光滑JavaScript (The Slick JavaScript)

Slick.definePseudo('key',function(optionalArgument) { var trueOrFalse; // logic here to determine if there is a match return trueOrFalse; })

The above code sample displays the basic format of defining a custom pseudo class selector. Let's create a few "realistic" pseudo class selectors.

上面的代码示例显示了定义自定义伪类选择器的基本格式。 让我们创建一些“现实的”伪类选择器。

具有存储价值的元素 (Elements with a Storage Value)

Slick.definePseudo('storage',function(key) { return document.id(this).retrieve(key); });

The above code sample allows you to find elements with a given storage value based on the provided key.

上面的代码示例使您可以根据提供的键来查找具有给定存储值的元素。

具有指定事件类型的元素 (Elements with a Specified Event Type)

Slick.definePseudo('hasEvent',function(eventType) { var self = document.id(this); return eventType && self.retrieve('events') && self.retrieve('events')[eventType] && self.retrieve('events')[eventType].length; });

The above code sample allows you to find elements with a MooTools-given click event.

上面的代码示例使您可以通过MooTools提供的click事件查找元素。

表单元素 (Form Elements)

Slick.definePseudo('form',function() { var tag = document.id(this).get('tag'), elements = ['textarea','select','input','button'] return elements.contains(tag); });

The above code sample allows you to get all form elements within a given form.

上面的代码示例使您可以获取给定表单中的所有表单元素。

Those are just a few examples of creating your own custom pseudo class selectors. Another great thing about Slick is that numerous psuedo class selectors are already defined: empty, not, contains, first-child, last-child, only-child, nth-child, nth-last-child, nth-of-type, nth-last-of-type, index, even, odd, first-of-type, last-of-type, only-of-type, enabled, disabled, checked, and selected.

这些只是创建自己的自定义伪类选择器的几个示例。 关于Slick的另一个很棒的事情是，已经定义了许多伪类选择器：为空，不包含，第一个孩子，最后一个孩子，唯一孩子，第n个孩子，第n个最后一个孩子，第n个类型，第n个-last-of-type，index，偶数，奇数，first-of-type，last-of-type，only-of-type，启用，禁用，检查和选择 。

Slick comes bundled with MooTools 1.3 but do remember that Slick is framework-independent an can function on its own. Can you think of any other pseudo class selectors that would be useful? Share them!

Slick与MooTools 1.3捆绑在一起，但请记住，Slick与框架无关，可以单独运行。 您能想到其他任何有用的伪类选择器吗？ 分享他们！

翻译自: https://davidwalsh.name/slick-pseudo

slick 自定义 图标

相关资源：jdk-8u281-windows-x64.exe