Adición de datos personalizados atributo para un nuevo nodo en Jquery no funciona

Question

He intentado utilizar el método data (jQuery 1.7.1) en este código:

var q = '<div class="form-error-marker"></div>'; 
var t = $(q).data('message', message).insertAfter(el); 

y no funciona.

Tenga en cuenta que esto funciona:

var t = $(q).attr('data-message', message).insertAfter(el); 

¿Por qué la primera variante no funciona?

EDIT: insertAfter funciona correctamente y se añade nueva div después el (que es instancia de un elemento que me sale por getElementById() función; cuento largo que tiene una biblioteca que extiendo).

Cuando digo 'no funciona' me refiero a que no se almacena el atributo 'mensaje de datos'.

Answer 1

El uso de data establece un dato arbitrario para este nodo; no agrega un nuevo atributo data-. Sólo tiene que añadir el atributo con la función attr, y luego acceso con data

var q = $('<div class="form-error-marker"></div>').attr("data-message", message); 

Ahora acceder a él de esta manera:

var message = q.data("message"); 

Aquí hay una fiddle

Answer 2

Cuando se utiliza jQuery.data que Don No cambie los atributos del elemento; en su lugar, guarde los datos en $.cache. Por lo tanto, si desea cambiar los atributos del elemento use jQuery.attr, cuando desee guardar información, use jQuery.data