Создание нативного элемента dom с данными, которые будет использовать data() в jQuery

Question

Я хотел бы создать элемент DOM, изначально привязывая к нему данные. и затем создайте для него элемент jQuery, установив (автоматически) эти данные, чтобы они были доступны через функцию data().

var x = document.createElement("div");
x. ???? // add the data {a: {x: 4, y:6}}
x = $(x);
var obj = x.data("a")
console.log(a.x); // getting '4'

это можно сделать - и как?

пожалуйста, обратите внимание, что data-[attrib-name] не будет работать, так как мне нужны сложные данные.

Answer 1

Ты можешь использовать $.data() установить данные на собственном DOM-узле в jQuery

var x = document.createElement("div");

$.data(x, 'a', {x: 4, y:6});


x = $(x);
var obj = x.data("a")
console.log(obj);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

Вы можете установить data атрибут, с помощью JavaScript setAttribute() вот так:

var theDiv = document.createElement("div");
theDiv.setAttribute('data-x', '4');
theDiv.setAttribute('data-y', '6');

Доступ к ним:

console.log(theDiv.getAttribute('data-y'));

А также получить доступ к тому же с помощью jQuery:

$(theDiv).data("x");