Video: Working with the jQuery data() Function


jQuery has a lot of useful functions tucked away that can be used to do perform some interesting tasks in Web applications. One of my favorites is the data() function which can be used to cache data and associate it with DOM elements. It’s extremely useful when you want to store data returned from an Ajax call on an element (such as a <tr>) so that you can easily access it later as the user interacts with the page.

Here’s a segment from the jQuery Tips and Tricks course that Elijah Manor and myself created for Pluralsight that demonstrates how the data() function can be used in applications. In the video I show how to cache data retrieved from an Ajax call, discuss when it’s appropriate to do this and when it’s not, and cover some other miscellaneous topics along the way.

Working with the jQuery data() Function



comments powered by Disqus

3 Comments

  • Holy XSS hole. If a data field had a start angle bracket, content could "disappear." If data had a script tag, things could go really wrong. Please teach us to encode data before concatenating markup or teach us to use Handlebars or a similar template framework.

  • Rob:

    HTML content would be added into data() as a string since an Ajax call was made so it wouldn't magically disappear (it's added into memory so no change to the data). If the value was then written out directly to the page then I'd agree that could potentially be bad. It's a tutorial though and the focus is on using data(), not on security. Otherwise I think every tutorial out there would have to go through X number of security issues which then takes it from a focused tutorial to not so focused. Good tutorials keep things focused though and don't try to cover everything and the kitchen sink.

    I agree with what you're saying for real apps though. :-)

    Dan

  • Hi,
    This is great!! you have explained it in a manner that even a layman can understand it.

Comments have been disabled for this content.