如何确定使用哪个实例创建了 HTML 元素？答案

【问题标题】：How to determine with which instance a HTML element has been created?如何确定使用哪个实例创建了 HTML 元素？
【发布时间】：2015-03-27 17:57:33
【问题描述】：

var myElement = function(){
     this.element = document.createElement('div');
}

var myNewElement = new myElement;
console.log(myNewElement instanceof myElement); //return true

var myDiv = myNewElement.element;
console.log(myDiv instanceof myElement); //return false

是否有可能确定 myDiv 是从 myElement 函数创建的？

【问题讨论】：

除非你将一个属性分配给以某种方式“标记”对象的元素，否则不会。
您是否建议在某处存储对 myElement 的引用，例如在 myDiv 的数据属性中？
为什么需要知道元素是由特定函数创建的？
让它能够知道自己是否可以和周围的其他元素交互，然后加载交互函数

标签： javascript dom instanceof

【解决方案1】：

与@Felix 所说的一样，

这样的using data attributes:

var myElement = function(){
    this.element = document.createElement('div');
    this.element.dataset.instanceof = myElement;
    //document.body.appendChild(this.element);
}

var myNewElement = new myElement;
console.log(myNewElement instanceof myElement); //return true

var myDiv = myNewElement.element;
console.log(myDiv.dataset.instanceof == myElement); //return true

这将导致 HTML 元素看起来像这样（如果 appendChild() 未注释）：

<div data-instanceof="function (){
    this.element = document.createElement('div');
    this.element.dataset.instanceof = myElement;
    document.body.appendChild(this.element);
}"></div>

或者不要分配整个函数，而是使用这样的字符串：

var myElement = function(){
    this.element = document.createElement('div');
    this.element.dataset.instanceof = "myElement";
}

var myNewElement = new myElement;
console.log(myNewElement instanceof myElement); //true

var myDiv = myNewElement.element;
console.log(myDiv.dataset.instanceof == "myElement"); //true

【讨论】：

优雅的解决方案。从技术上讲，它回答了这个问题，所以我将其标记为已解决。但在我的设计中，我将混合这个解决方案，通过分配随机 ID、将 ID 与特殊对象中的类映射，并使用自定义 CRUD（创建/读取/更新/删除），使用户更安静（正确的代码） ) 系统来查询这个对象。相同的方式，但模板中的代码更少。