Javascript 尝试设置href时，element.setAttribute不是函数

为了避免垃圾邮件，我将链接更改为JavaScript函数，该函数在单击链接时解码并设置href

HTML:

它具体指出：

element.setAttribute("href", b);

（如果我把它放在第一位的话，后面的那一行）

我做错了什么？在此之前，我使用了onClick HTML属性来调用openEmail（this）函数，但我正在尝试实现一个内容安全策略，该策略将onClick视为不安全的内联

---

谢谢

正如Pointy所提到的，事件处理程序传递的是一个，而不是一个元素

改用

这个.setAttribute（…）

此

引用处理程序绑定到的元素

请注意，

element.setAttribute（“onclick”，”）

不会删除您通过

addEventListener

添加的事件处理程序，请改用

removeEventListener

：

function openEmail(element) {
  var b = decode("DecodedMailToEmailAddress");
  this.setAttribute("href", b); // or just this.href = b;
  this.removeEventListener("click", openEmail);
}

---

您可以了解和上的事件处理的详细信息。

事件处理程序为回调函数提供事件属性。您要查找的元素可以在event.target中找到

因此，函数变成：

function openEmail(event) {
  var b = decode("DecodedMailToEmailAddress");
  event.target.setAttribute("href", b);
  event.target.setAttribute("onclick", "");
};

---

顺便说一下，您也可以使用

event.target.href=…

，设置事件处理程序最好使用

addEventListener

，而不是像在代码的另一部分中那样设置

onclick

。

事件处理程序被传递一个事件对象，不是事件所涉及的元素。您需要

元素.target

（但调用事件对象“元素”会产生误导，因此请选择其他名称）@JohnColeman:如果单击链接内的图标，则此操作无效。@FelixKling感谢您的警告。

event.currentTarget

会更可靠吗？@JohnColeman:是的，这会起作用。如果用户单击链接内的图标（他们会这样做，因为链接不包含其他子项），则不会起作用。你是对的。解决方案是使用

event.target.closest（'A'）.setAttribute（…）

。不过，这只适用于现代浏览器。

element.setAttribute("href", b);

function openEmail(element) {
  var b = decode("DecodedMailToEmailAddress");
  this.setAttribute("href", b); // or just this.href = b;
  this.removeEventListener("click", openEmail);
}

function openEmail(event) {
  var b = decode("DecodedMailToEmailAddress");
  event.target.setAttribute("href", b);
  event.target.setAttribute("onclick", "");
};