performance - Quickest way to find all elements by an array of Ids with jQuery -


given array of objects like:

var things = [{    "id": "123a",    "name": "456" },{    "id": 123b",    "name": 456" },{    "id": "123c",    name": "456" },{    "id": "123d",    "name": "456" }]; 

what quickest way find elements contain ids.

currently i'm doing along lines of:

$.each(things, function(i, e) {     $row = $('td[vid=' + e.id + ']', table); }); 

but feels slowish. working large grid of data on client, 40 columns, 250 rows. table full of single values, matrix of data, , need find cells , modify value, updating entire column of data.

wondering if there's more efficient way this.

edit:

so table structure along lines of:

<table>   <thead>     <tr>       <th>&nbsp;</th>       <th vid="1">version 1</th>       <th vid="2">version 2</th>       <th vid="3">version 3</th>       <th vid="4">version 4</th>     </tr>   </thead>   <tbody>     <tr>       <td destid="1">dest 1</td>       <td destid="2" vid="1">x</td>       <td destid="2" vid="2">x</td>       <td destid="2" vid="3">x</td>       <td destid="2" vid="4">x</td>     </tr>     <tr>       <td destid="2">dest 2</td>       <td destid="2" vid="1">x</td>       <td destid="2" vid="2">x</td>       <td destid="2" vid="3">x</td>       <td destid="2" vid="4">x</td>     </tr>     <tr>       <td destid="3">dest 3</td>       <td destid="3" vid="1">x</td>       <td destid="3" vid="2">x</td>       <td destid="3" vid="3">x</td>       <td destid="3" vid="4">x</td>     </tr>   </tbody> </table> 

if select top on version, result be:

[{   id: 5,   vid: 2,   destid: 1 },{   id: 6,   vid: 2,   destid: 2 },{   id: 7,   vid: 2,   destid: 3 }] 

likewise similar when selecting destination versions.


i think best method me refactor cells be:

id="2-1" | id="2-2" | id="2-3"

and use var cell = document.getelementbyid(data.vid + "-" + data.destid);

rather looking cell like:

var cell = $('td[vid=' + data.vid + '][destid=' + data.destid + ']', table);

w3c states ids should unique. therefore, specifying more id, selection, typically superfluous.

$row = $('#' + e.id) 

this executes faster example postulated, maps directly native document.getelementbyid() . also, example postulated jquery has manually traverse dom, expensive.


update:

you later mentioned use of composites ids, fields containing unique values not guaranteed. solution workable, however, augment include sensible namespacing—for readability, , prevent id clashing (ie: 2 tables on same page using same id scheme.).

here proposed solution based on updated constraints:

var vid_id = '1'; var dest_id = '1'; var dom_query = '#' + 'vid_id-' + vid_id +'dest_id' + dest_id;  $row = $(dom_query); 

this solution can optimized use without jquery if necessary.



w3c specification on ids: http://www.w3.org/tr/html401/struct/global.html#h-7.5.2

decent synopsis on jquery optimizations: http://24ways.org/2011/your-jquery-now-with-less-suck/


Comments

Popular posts from this blog

javascript - Laravel datatable invalid JSON response -

java - Exception in thread "main" org.springframework.context.ApplicationContextException: Unable to start embedded container; -

sql server 2008 - My Sql Code Get An Error Of Msg 245, Level 16, State 1, Line 1 Conversion failed when converting the varchar value '8:45 AM' to data type int -