HTML 요소에 JavaScript 객체를 첨부하는 좋은 방법이 있습니까?

JavaScript 개체를 HTML 요소와 연결하고 싶습니다. 이를 수행하는 간단한 방법이 있습니까?

나는 눈치 HTML DOM이 의 setAttribute 메소드를 정의하고이 임의의 속성 이름에 대해 정의 된 것 같습니다. 그러나 이것은 문자열 값만 설정할 수 있습니다. (물론 이것을 사용하여 키를 사전에 저장할 수 있습니다.)

세부 사항 (일반적인 질문에 대부분 관심이 있지만) :

특히, 트리의 노드를 나타내는 HTML 요소가 있고 드래그 앤 드롭을 활성화하려고하지만 jQuery 드롭 이벤트는 드래그 앤 드롭되는 요소 만 제공합니다.

이벤트 핸들러로 정보를 가져 오는 일반적인 패턴은 자바 스크립트 객체를 생성하는 동시에 HTML 요소를 생성 한 다음 이러한 자바 스크립트 객체를 닫아 이벤트 핸들러를 정의하는 것 같습니다. 그러나이 방법은 잘 작동하지 않습니다. 케이스 (드래그가 시작될 때 채워지는 전역 객체를 가질 수 있지만 ... 약간 불쾌한 느낌).

jQuery data () 메서드를 보셨습니까 ? 원하는 경우 복잡한 개체를 요소에 할당하거나 해당 메서드를 활용하여 최소한 개체 (또는 다른 데이터)에 대한 참조를 유지할 수 있습니다.

JavaScript 객체에는 임의의 속성이 할당 될 수 있으며이를 허용하기 위해 특별히 수행해야하는 작업은 없습니다. 여기에는 DOM 요소가 포함됩니다. 이 동작은 DOM 표준의 일부는 아니지만 JavaScript의 첫 번째 버전으로 돌아가서 완전히 신뢰할 수 있습니다.

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