javascript - 当存在 onclick 时从 innerHTML 到 dom 方法

Question

我有这段javascript:

var d = document.createElement("div");
d.innerHTML = "<span onclick='myFunc(this)'>click here</span>";

我想通过 dom 方法重写(没有 innerHTML) 所以像这样:

var d = document.createElement("div");
var span = document.createElement("span"); 
...
d.appendChild(span); 

我不知道该怎么做的是如何连接 span 对象，以便它调用全局函数“myFunc”并将自身 (this) 作为参数传递？

Answer 1

只需设置它的“onclick”属性:

span.onclick = function() { myFunc(this); };

总是调用通过“onfoo”属性绑定(bind)的“老式”事件处理程序，这样 this 指的是处理事件的元素。因此，您只需使用一个简单的匿名函数包装对您的处理程序函数的调用即可调用您的代码并将其传递给 this。如果您实际上不需要将元素引用作为参数传递给您的处理程序，您可以只写:

span.onclick = myFunc;

在这种情况下，您自己的函数将有 this 可用于引用受影响的元素。