Thêm dữ liệu tùy chỉnh cho một nút mới trong Jquery không hoạt động

Question

Tôi cố gắng để sử dụng phương pháp data (jQuery 1.7.1) trong mã này:

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

và nó không hoạt động.

Lưu ý rằng công trình này:

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

Tại sao phiên bản đầu tiên không làm việc?

EDIT: insertAfter hoạt động chính xác và div mới được thêm sau el (là trường hợp của một phần tử mà tôi nhận được theo hàm getElementById(); ngắn câu chuyện tôi có thư viện mà tôi mở rộng).

Khi tôi nói 'nó không hoạt động' có nghĩa là thuộc tính 'dữ liệu-tin nhắn' không được lưu trữ.

Answer 1

Sử dụng data như thế sẽ đặt một đoạn dữ liệu tùy ý cho nút này; nó không thêm thuộc tính data- mới. Chỉ cần thêm thuộc tính với attr chức năng, và sau đó truy cập nó với data

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

Bây giờ truy cập vào nó như thế này:

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

Dưới đây là một fiddle

Answer 2

Khi bạn sử dụng jQuery.data bạn don không thay đổi thuộc tính phần tử, thay vào đó dữ liệu của bạn được lưu trong $.cache. Vì vậy, nếu bạn muốn thay đổi thuộc tính phần tử, hãy sử dụng jQuery.attr, khi bạn muốn lưu một số thông tin, hãy sử dụng jQuery.data