CODEWITHSUNDEEP
prototypejscss-selectors
user284295
user284295

Reputation: 209

Prototype Selector : simple examples

i'm just starting prototype, i was on jquery before.

I can't find easy examples on the internet about how :

Upvotes: 4

Views: 11521

Answers (3)

robjmills
robjmills

Reputation: 18598

A few things i would add.

$$('.myClass').each(function(d) {
  d.hide();
});

can be replaced with this:

$$('.myClass').invoke("hide");

Also, be careful with your use of $$, within a page with a large dom it is usually faster to target a parent element with $ and then use select() for your selector

so 

$$('div#outer div#inner') etc....

can be rewritten like this:

$('parent_of_inner_and_outer').select('div#outer div#inner') etc....

Upvotes: 1

John Conde
John Conde

Reputation: 219814

As mentioned above you shouldn't have the same ID on a page more then once. Besides being against standards it's a recipe for potential problems since you don't know how your JavaScript will react to it. Uses classes instead.

Selecting all elements having the same id class on a page (i'm doing this but it only works for the first element : $('mydiv').hide() )

Use $$:

$$('.myclass')

Selecting a div that is contained in another div by their id.

Use $$:

$$('div#outer div#inner')

hiding all elements that have myClass class.

Use $$, each(), and hide()

$$('.myClass').each(function(d) {
  d.hide();
});

$$ is your friend.

Upvotes: 7

JST
JST

Reputation: 1174

This isn't particularly pretty, but if you run into a situation like I did recently, where there could potentially be multiple items with the same id on the page and you don't have the ability to change that, then something like this will work. In my case, I at least knew they were all in span tags.

       var spans = $$('span');
        for (i = 0; i < spans.length; i++) {
           var span = spans[i];
           if (span.id == 'add_bookmark_image_' + id) {
              span.hide();
           }
           if (span.id == 'is_bookmarked_image_' + id) {
              span.show();
           }
        }

Upvotes: 0

Related Questions