Click here to check my latest exciting videos on youtube
Search Mallstuffs

Flag Counter
Spirituality, Knowledge and Entertainment


Locations of visitors to this page


Latest Articles


Move to top
Select Groups of similar elements using position selector
Posted By Sarin on Jul 15, 2012     RSS Feeds     Latest Hinduism news
2620 Views

Using this type of selector, we can narrow the search of our selection and can apply specific actions on only this selected elements.
For our demo purpose let us defined four strong element and seven buttons for each type of position type selectors
  
  <strong>Hare Krishna</strong><br />
<strong>Krishna Krishna</strong><br />
<strong>Hare Rama</strong><br />
<strong>Rama Rama</strong><br />

Different position type selector methods are a follow:

:first: This selects the first matching element. This code alert the user with text of first strong element
  
alert($('strong:first').text());
  

:last: this selects the last matching element. This code alert the user with text of last strong element

alert($('strong:last).text());
  

  
:even: this selects the elements at even position i.e. 0, 2 ,4. This code alert the user with text of even positioned strong element. Since, the index of html elements starts with 0, first (index 0) and third (index 2) strong elements are shown.

alert($('strong:even).text());
  

  
✓: odd: selects the elements at even position i.e. 1, 3, 5. this code alerts the user with text of odd positioned strong element. Since, the index of html elements starts with 0, second (index 1) and fourth (index 3) strong elements are shown.
  
alert ($('strong:odd).text());
  


✓: eq(index): select the element with an index value equal to index specified in function. This code alerts the user with text of strong element positioned at index 2. Since, the index of html elements starts with 0, third strong element is shown.
  
alert($('strong:eq(2)').text());
  

  
 ✓ :gt(index): Selects all elements with an index value greater than the index specified in function. This code alerts the user with text of strong element positioned at index greater than 2. Since, the index of html elements starts with 0, fourth(index 3) strong element is shown.
  
alert($('strong:gt(2)').text());


  
:lt(index): Selects all elements with an index value less than the index specified in function. This code alerts the user with text of strong element positioned at index less than 2. Since, the index of html elements starts with 0, first(index 0) and second(index 1) strong elements are shown.

alert($('strong:lt(2)').text());



here


Share this to your friends. One of your friend is waiting for your share.
Share on Google+ Share on Tumblr Print Browser Favorite
Related Articles
Select Parent, Child, sibling,descendants HTML element using jquery
Replacing and removing HTML Elements
Cloning HTML Elements using jquery
JQuery FAQ and Jquery Effects
Creating your first application in JQuery
Select Groups of similar elements using position selector
Playing with HTML using Jquery
Get Set Value of any HTML element using jquery-Val function
Manipulating Elements and Animations Using Jquery
Advanced JQuery Fading Effects

Post Comment