Question

I was trying out the jQuery Data linking proposal from Microsoft and noticed something strange.

My objects get this extra property and I was wondering what the reason for that is. I first thought it was a mistake I made but I noticed their demo page does the same thing

This is the json result of my objects:

[{
        "propertyName":"ProductNamese",
        "controlType":"Text",
        "jQuery1274021322131":6
    },
    {
        "propertyName":"Price",
        "controlType":"Number",
        "jQuery1274021322131":9
    },
    {
        "propertyName":"Description",
        "controlType":"TextArea",
        "jQuery1274021322131":12
    }
]

The property I am talking about is “jQuery1274021322131”.

Answer 1

When you cast an DOM object to a jQuery object (i.e. $("#SomeElementID")), jQuery appends a special “expando” property to the object. I believe that this property is used internally by the library to assist in caching the element in its internal array for faster access.

Digging through the library, this is the code that creates that value and how it’s used internally:

    var expando = "jQuery" + now(), uuid = 0, windowData = {};

    jQuery.extend({
        cache: {},

        data: function( elem, name, data ) {
            elem = elem == window ?
                windowData :
                elem;

            var id = elem[ expando ];

            // Compute a unique ID for the element
            if ( !id )
                id = elem[ expando ] = ++uuid;

            // Only generate the data cache if we're
            // trying to access or manipulate it
            if ( name && !jQuery.cache[ id ] )
                jQuery.cache[ id ] = {};

            // Prevent overriding the named cache with undefined values
            if ( data !== undefined )
                jQuery.cache[ id ][ name ] = data;

            // Return the named cache data, or the ID for the element
            return name ?
                jQuery.cache[ id ][ name ] :
                id;
        },
// snipped