Question

我尝试将onClick函数从图像复制到span对象。但是我没理解。

我已直接使用onClick=img.onClick，onClick=new Function(img.onClick)等进行了尝试。

if (img.onclick != undefined)
{
    var imgClick = img.onclick;
    strNewHTML = strNewHTML + " onMouseOver=\"this.style.background"
    + "= '#cecece'\" onMouseOut=\"this.style.background = ''\" onclick=\""+imgClick+"\">";
}

任何人都可以帮助我吗？

谢谢！

Answer 1

span.onclick= img.onclick;

JavaScript区分大小写，DOM事件处理程序属性都是小写的。

编辑：

if (img.onclick != undefined) {
    strNewHTML = strNewHTML + " onMouseOver=\"this.style.background"
    + "= '#cecece'\" onMouseOut=\"this.style.background = ''\" onclick=\""+imgClick+"\">";
}

那是完全不同的事情。您正在创建HTML字符串。但onclick DOM属性包含function对象。 function个对象无法添加到字符串中。（如果你调用somefunction.toString()，它们将被转换为你得到的东西，这不是一个可以用作事件处理程序的东西。）

如果要获取要添加到HTML中的onclick属性的文本值，则必须使用span.getAttribute('onclick')方法执行此操作。但是由于getAttribute的实施中的错误而无法在IE中使用，因此您不得不诉诸span.getAttributeNode('onclick').value。然后当您将其添加到HTML字符串中时，您必须对其进行HTML转义，以便其中的所有<，&和"字符都显示为{{1等等，否则他们会打破标记。

然而，这真的很难看; 不要这样做。实际上，HTML字符串吊索总是很糟糕。特别是当您在JavaScript字符串中的HTML内部获得JavaScript代码时。逃避规则变得疯狂，如果你在转发来自用户输入的内容时犯了错误，你就会给自己一个跨站点脚本的安全漏洞。

相反，使用DOM方法。这使得所有的转义都脱离了等式，并且它通常比被黑客攻击的HTML标记字符串更具可读性。然后你可以自由地将<分配给你喜欢的任何功能。例如：

onclick

还考虑使用简单的CSS var span= document.createElement('span'); if (img.onclick) span.onclick= img.onclick; span.onmouseover= function() { this.style.background= '#CECECE'; }; span.onmouseout= function() { this.style.background= ''; }; someparentelement.appendChild(span);规则替换mouseover / mouseout，以实现可维护性。唯一仍需要:hover帮助的浏览器是IE6。

读出JavaScript onClick函数体并将其用于另一个onClick

1 个答案: