如何确定一个 HTML 元素是由哪个实例创建的？

Question

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函数创建的？

- Guillaume Fe

---

除非您为元素分配某种“标记”对象的属性，否则不行。 - Felix Kling

你会建议将myElement的引用存储在某个地方，例如存储在myDiv的数据属性中吗？ - Guillaume Fe

你为什么需要知道一个元素是由哪个特定函数创建的？ - Felix Kling

使其能够知道是否可以与周围的另一个元素交互，然后加载交互函数。 - Guillaume Fe

Answer 1

和 @Felix 所说的类似，

这个怎么样 使用数据属性:

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

- sbolel

---

优雅的解决方案。从技术上讲，它回答了问题，所以我将其标记为已解决。但在我的设计中，我会混合使用这个解决方案，使用户更加舒适（适当的代码），通过分配随机ID，将ID映射到特殊对象中的类，并使用自定义CRUD（创建/读取/更新/删除）系统来查询此对象。同样的方式，在模板中减少了代码量。 - Guillaume Fe