Question

I am using jQuery and jQuery UI, and I am almost new to JavaScript. I would like to set a global variable in the window object so to keep custom data related to multiple jQuery objects. That is, at this time I am using the following (poor) code:

// Given
window.myDataObject = {};

// Then, in the same file, I run multiple times (one time for each 'tag_id_1', 
// 'tag_id_2', ..., 'tag_id_N') the following code
var tag      = $('#tag_id_N')
myDataObject = { pagination: { page : 1, per_page: 10 } } // This aims to keep pagination data for tags.

Since I am trying to keep data for multiple tags, running the above code multiple times makes the window.myDataObject to be continuously “re-initialized” (making the keeping process inefficient). Because that, I thought to add “namespaced” properties (maybe, namespaced with “something” related to each tag object) to window.myDataObject so that each tag has its own pagination data.

How can I make that? Is that approach a “good” / “proper” way to proceed?

Answer 1

I think you’re just looking for the .data() method:

The .data() method allows us to attach data of any type to DOM
elements in a way that is safe from circular references and therefore
from memory leaks.

We can set several distinct values for a single element and retrieve
them later: