JavaScriptオブジェクトをHTML要素に添付する良い方法はありますか？

JavaScriptオブジェクトをHTML要素に関連付けたいのですが。これを行う簡単な方法はありますか？

HTML DOMがsetAttributeメソッドを定義していることに気づき、これは任意の属性名に対して定義されているように見えます。ただし、これは文字列値のみを設定できます。（もちろん、これを使用してキーを辞書に格納できます。）

詳細（私は主に一般的な質問に興味があります）：

具体的には、ツリー内のノードを表すHTML要素があり、ドラッグアンドドロップを有効にしようとしていますが、jQueryドロップイベントでは、ドラッグアンドドロップされる要素しか表示されません。

イベントハンドラーに情報を取得するための通常のパターンは、JavaScriptオブジェクトの作成と同時にHTML要素を作成し、これらのJavaScriptオブジェクトを閉じることによってイベントハンドラーを定義することですが、これではうまくいきません。ケース（ドラッグの開始時に入力されるグローバルオブジェクトを使用できますが、これは少し厄介に感じられます）。

jQuery data（）メソッドを見たことはありますか？必要に応じて要素に複雑なオブジェクトを割り当てることも、そのメソッドを利用して少なくともオブジェクト（または他のデータ）への参照を保持することもできます。

JavaScriptオブジェクトには、任意のプロパティを割り当てることができます。許可するために特別なことを行う必要はありません。これにはDOM要素が含まれます。この動作はDOM標準の一部ではありませんが、JavaScriptの最初のバージョンに戻った場合に当てはまり、完全に信頼できます。

var div= document.getElementById('nav');
div.potato= ['lemons', 3];