Josh,
Since you aren't creating nodes, why not wait until after you insert
the string of html onto the page, at which point you will have access
to those nodes, so you can loop through them and set all of the
corresponding properties on them using .data() or just the usual
document.getElementById('id').property = value method?
You could also store all of the data in an object with the element ids
as keys, such as:
var data_store = {
elementId1: {
name: name,
type: type,
about: about
},
elementId2: {
name: name,
type: type,
about: about
}
}
Then it is easy to access that information by binding events to the
elements that access data_store[this.id]
On Apr 17, 5:50 am, RobG <rg...@iinet.net.au> wrote:
> On Apr 17, 3:34 pm, RobG <rg...@iinet.net.au> wrote:
> [...]
>
> > OK, here is a dead basic proof of concept. Of course it is nowhere
> > near production code, but I think you can see where it's going. I
> > would wrap the entire thing in the module pattern, but I've just used
> > basic globals at this stage. My intention is to show that efficient
> > DOM manipulation is possible and that access to related data isn't
> > hard.
>
> > It took me about 45 minutes to write the entire thing (more than half
> > of that was writing the function to generate the test data set),
> > tested in Firefox 3 and IE 6 on a 3.4GHz Pentium 4, Windows XP, the
> > insert runs in less than 500ms. I'll test it on the G4 iBook for
> > reference later.
>
> Safari 4 on iBook takes around 132ms, Firefox was around 1900.
>
> [...]
>
> > function showData(evt) {
> > var evt = evt || window.event;
> > var tgt = evt.target || evt.srcElement;
> > var data;
> > if (tgt && tgt.tagName && tgt.tagName.toLowerCase() == 'a') {
> > data = dataObj[tgt.id];
>
> // Should guard against error here
> if (typeof data != 'undefined') {
>
>
>
> > // Have data related to this element, do
> > // something with it
> > alert(
> > 'Name: ' + data.name
> > + '\nType: ' + data.type
> > + '\nAbout: ' + data.about
> > );
>
> }
>
> > }
> > }
>
> --
> Rob
