$('som_div') $('som_div div.child_of_some_div')

[kstubs]

$('som_div') 

$('som_div div.child_of_some_div')

I find myself frequently referencing child divs so use .down() a lot.  It would be convenient at times to get to that child div directly with the $ shortcut as I've exampled above. Has anyone else considered this or something similar?  Would this be a costly addition to the core, or perhaps a mistake for the core? 

1 good justifying reason for this, and perhaps there is an easy fix here as well.

I frequently will write a class and the class itself will expect a layer object; that layer object being the primary container for content the class interacts with.  So my constructor usually looks like:

var myClass = Class.create({

  initialize:function(layer) {

    this.container = $(layer);            // here is the 

  }

});

I'm finding that I do not have a convenient way to initialize myClass when layer is not a defined object, so when it is a child object of a defined object this is not convenient.

I'd like for the following to be suitable means to instantiate myClass:

var _myClass = new myClass('my_div');    // where my_div is a defined object

var _myClass = new myClass('my_div div.child')    // where we intend the child div of my_div to be the classes container

The latter does not work with the $ approach in the initializer for the class.  Is there another convenient means to accomplish this in the class or am I stuck doing this:

var _myClass = new myClass($('my_div').down('div.child'))

Karl..

[T.J. Crowder]

Hi,

> $('som_div')
> $('som_div div.child_of_some_div')
>
> I find myself frequently referencing child divs so use .down() a lot.  It
> would be convenient at times to get to that child div directly with the $
> shortcut as I've exampled above.

If it's just syntactic sugar you're looking for, you can readily
create your own function for that:

function $X(id_like_thing) {
var index,
childSelector,
element;
index = id_like_thing.indexOf(" ");
if (index >= 0) {
childSelector = id_like_thing.substring(index+1).strip();
id_like_thing = id_like_thing.substring(0, index - 1);
}
element = $(id_like_thing);
if (element && childSelector) {
element = element.down(childSelector);
}
return element;
}

(Untested off-the-cuff code.)

> Is there another convenient means to accomplish this in the class or
> am I stuck doing this:
> var _myClass = new myClass($('my_div').down('div.child'))

If you're trying to avoid `down` for some reason, you can do this:

var _myClass = new myClass($$('#my_div div.child')[0])

The more specific you can be on the right-hand side of that, the
better, because the way most selector engines work is right-to-left:
First find matches for `div.child` and then work up the ancestor chain
of each match to see if the rest of the selector matches. Of course,
you'd have to profile that to see whether it's slower or faster (if
you care) than `down`. Be sure to profile on your target browsers, as
the answer will vary markedly depending on whether the browser
supports `querySelectorAll`.

FWIW,
--
T.J. Crowder
Independent Software Engineer
tj / crowder software / com
www / crowder software / com

[kstubs]

I'm always looking for the sugar T.J.  I like your off-the-cuff example, I'll try that.  Just curious, is this core worthy?  Certainly the #1 consideration would be performance, but shouldn't be any performance hit if no additional selector is found.  The 2nd consideration would be, is it a strange or unusual request - so am I the only guy who wants it?

[Marc]

I just want to add my 2 cents: In my experience there's 2 reasons to
instantiate a widget class with an element:

1. It's a single widget on the page: in which case it should probably
have a unique id and can be instantiated with var widget = new
Widget("widget_id");
2. There are numerous widgets of the same kind identified by a
className which can be instantiated with $$(".widget-
class").each(function(elemnent) { new Widget(element); });

In both cases you'd use this.element = $(element); in the initialize
method.

-- Marc