W3C home > Mailing lists > Public > www-style@w3.org > September 2013

Re: Making selectors first-class citizens

From: Garrett Smith <dhtmlkitchen@gmail.com>
Date: Sun, 22 Sep 2013 09:14:06 -0700
Message-ID: <CABZUbM1H025rN_ZhSS+eBCjAmZmuZ+CVNaCPRPOsLTygo-wKow@mail.gmail.com>
To: Brian Kardell <bkardell@gmail.com>
Cc: Domenic Denicola <domenic@domenicdenicola.com>, Robin Berjon <robin@w3.org>, "www-style@w3.org" <www-style@w3.org>, WebApps WG <public-webapps@w3.org>
On 9/12/13, Brian Kardell <bkardell@gmail.com> wrote:
> On Sep 12, 2013 2:16 AM, "Garrett Smith" <dhtmlkitchen@gmail.com> wrote:
>>
>> FWD'ing to put my reply back on list (and to others)...
>>
>> On Sep 11, 2013 6:35 AM, Anne van Kesteren <annevk@annevk.nl> wrote:
>>
>> As far as I can tell Element.prototype.matches() is not deployed yet.
>> Should we instead make selectors first-class citizens, just like
>> regular expressions, and have
>>
>> var sel = new Selectors("i > love > selectors, so[much]")
>> sel.test(node)
>>
>> # 2007 David Anderson proposed the idea.
>>
>> That seems like a much nicer approach.
>>
>> (It also means this can be neatly defined in the Selectors
>> specification, rather than in DOM, which means less work for me. :-))
>>
>> # 2009 the API design remerged
>> http://lists.w3.org/Archives/Public/public-webapps/2009JulSep/1445.html
>>
>> # 2010 Selectors explained in an article:
>> http://www.fortybelow.ca/hosted/dhtmlkitchen/JavaScript-Query-Engines.html
>> (search Query Matching Strategy).

[...]

> I may be the only one, but... I am unsure what you are advocating here
> Garrett.
>
I have advocated and used the strategy of matching elements by

>From "Query Matching Strategy" ....

Most usage of queries don't allow for common traversal patterns of
finding an ancestor. Such traversal pattern is often needed when using
event delegation strategies, where the callback needs to know find an
ancestor matching a particular criteria, usually either ID, className
or tagName.

var sel = new Selector("ul.panel");

function clickCallback(ev) {
  var target = DomUtils.getTarget(ev);
  if(sel.test(target)) {
    panelListClickHandler(ev);
  }
}

For matching, sel.match(node); matchAll(node);

But el.matches() is not so good. Boolean methods should start with
'is', 'has', or 'can'. Also, the object that it is being called should
be responsible for the role of the method on it. Elements don't
"match"; selectors do.

Inre Selectors vs Selector, plural names lead to confusion (e.g.
UIEvent vs UIEvents in DOM specs). Postfixing 'List', is better. I
recently saw and commented on Elements, by suggesting ElementList.
-- 
Garrett
Twitter: @xkit
personx.tumblr.com
Received on Sunday, 22 September 2013 16:14:34 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:34 UTC