W3C home > Mailing lists > Public > www-style@w3.org > January 2014

Re: [selectors4] Upwards Ancestor Traversal API

From: Tab Atkins Jr. <jackalmage@gmail.com>
Date: Mon, 6 Jan 2014 14:02:52 -0800
Message-ID: <CAAWBYDCbLO_J33nT4oMQRWq_zTbcDv2t8DSx0Tp7G_L2qdhRcw@mail.gmail.com>
To: Simon Sapin <simon.sapin@exyr.org>
Cc: Garrett Smith <dhtmlkitchen@gmail.com>, www-style list <www-style@w3.org>
On Mon, Jan 6, 2014 at 11:25 AM, Simon Sapin <simon.sapin@exyr.org> wrote:
> On 06/01/2014 18:13, Garrett Smith wrote:
>>
>> For event bubbling, it is very useful to traverse up the DOM tree to
>> find an ancestor. For example:
>>
>>   findAncestorWithClass(el, className,  /*opt*/ container);
>>   findAncestorWithAttribute(el, attName, /*opt*/ value);
>>   jqueryObj.closest(selectorText, /*opt*/ context)
>>
>> It would be useful to have an API that traverses up the DOM tree and
>> tests each Element against a selector and returns either an Element or
>> null.
>>
>> Proposal:
>>
>>   querySelectorAncestor(startNode, selectorText[, optional Node
>> container);
>>
>> If container is not specified, container is the root node.
>>
>> Let currentParent be startNode.parentNode. While currentParent is not
>> container, if currentParent matches selectorText, it is returned.
>
> I don’t think we need new APIs for this. Using the subject indicator with
> the :scope pseudo-class should be enough:
>
>   ancestor = scope_element.querySelector('!.some_class :scope');

I agree with Garrett - I think it's useful to provide sugar for this
operation, due to how common it is.  I used .closest() *constantly*
back when I was regularly using jQuery; it's the analog of .find() for
moving around the tree.

I'd bet we could just use .closest() as the function name, actually.
It would be nice to go along with .find().

> (By the way, where is :scope being specified nowadays?)

Selectors.

~TJ
Received on Monday, 6 January 2014 22:03:44 UTC

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