jQuery, New Age JS Library
May 3rd, 2009
No comments
| jQuery – The new age JS library |
| We”ll take two scenario’’s to test the power of jQuery. The first one is, we have an table displayed in a page which has more rows added in it. When the user clicks on a button, the rows(alternate) style should be changed. If we use the normal javascript and DOM functions, then we”ll be using the className attribute to change the class name of the each row in a particular. The code may look like the following. |
| The First Scenario |
var trCollection = tblElement.getElementsByTagName("tr");
for(i=0;i<trCollection.length;i++) {
if(i%2 == 0)
trCollection[i].className = ''myEvenRow'';
}
|
| The above code may take time in case of MSIE |
$("table tr:nth-child(even)").addClass("myEvenRow");
|
| isn’t simple to use and fast in execution, Yes it made a sense when the rows are more. |
| The Second Scenario |
| When we have an grid view and the user does the operation based on the selected record using a checkbox or radio option, it’’s always painful for the developers to give a Check All/UnCheck All, |
| Here goes my stone age code(js) |
var trColl = document.getElementsByName("checkboxesName");
for(i=0;i&lt;trColl.length;i++)
trColl[i].checked = true;
|
| Lovely jQuery Code |
$(''input[name=checkboxesName]'').attr(''checked'', true);
|
| It really made huge difference when i had more # of checkboxes in the page. I tried increasing from 300 to 3000 elements to check, it made a huge difference in the execution time in MSIE 8.0, but FF i was not able to see the big difference, We can even try with timers in both the method of execution. |
| jQuery is really rocking and still i”m a baby in jQuery, will update you all soon with some other topics. |












