Replacement of Element.setUserData

Question

Before element.setUserData is deprecated in Firefox, I use it to store and attach some data to one element. But now from the doc:
https://developer.mozilla.org/en-US/docs/Web/API/Node.setUserData

We can see that this API is deprecated and Element.dataset is preferred.
I use element.setUserData to store object or array, but element.dataset can only store string.

So is there any other replacement for store object and attach it to an element?

Check [Replacement for DOM3 getUserData/setUserData methods](http://stackoverflow.com/questions/10943519/replacement-for-dom3-getuserdata-setuserdata-methods) — Anto Jurković, Nov 13 '13 at 07:59

score 0 · Answer 1 · answered Nov 13 '13 at 08:10

0

That is easy.. serialize your array into a string then take that sting and convert it back into an array....

var aUserData = new Array( "This", "Is", "Easy" ) ;

var sUserData = aUserData.toString( "|" ) ; // Serialize Array

var aBackFromString = sUserData.split( "|" ) ; // Convert String Back To Array

answered Nov 13 '13 at 08:10

IT Serenity

85
7

Yes, I have come up with this idea. But if the object is too large, I think this maybe is not the best choice. – Leslie Wu Nov 13 '13 at 08:24
Is there some API just behave the same as Element.setUserData? – Leslie Wu Nov 13 '13 at 08:24
The size of the data matters not whether it is an array or a string. – IT Serenity Nov 15 '13 at 06:49

score 0 · Accepted Answer · edited May 23 '17 at 10:28

Ref: How can I transfer data to firefox extension from web page

Use a CustomEvent, which can carry custom data in the .detail member.
From web:

  var event = new CustomEvent("custom-event-id", {
  "bubbles": true,
  "detail": {
    "some": "data",
    "number": 1
  }
});
elem.dispatchEvent(event);

From extension:

someWindowOrElement.addEventListener("custom-event-id", function(e) {
  console.log("got event for ", e.originalTarget, "with data", e.detail);
});

Replacement of Element.setUserData

2 Answers2