Styjun

In order to avoid spam I've changed my link to a JavaScript function that decodes and sets the href when the link is clicked.

HTML:

<li><a id="email"><i class="fas fa-email"></i></a></li>

JS:

function decode(a) 
 return a.replace(/[a-zA-Z]/g, function(c)
 return String.fromCharCode((c <= "Z" ? 90 : 122) >= (c = c.charCodeAt(0) + 13) ? c : c - 26);
 )


function openEmail(element) 
 var b = decode("DecodedMailToEmailAddress");
 element.setAttribute("href", b);
 element.setAttribute("onclick", "");
;

document.addEventListener('DOMContentLoaded', function () 
 document.getElementById('email').addEventListener('click', openEmail);
);

But every time I click the link I get the following error:

TypeError: element.setAttribute is not a function

And it specifically points to:

element.setAttribute("href", b);

(And the line after that, if I put it first)

What am I doing wrong? I used the onClick HTML attribute before this to call the openEmail(this) function, but I'm trying to implement a Content Security Policy and that considers onClick as unsafe-inline.

Thanks!

As Pointy mentions, the event handler is passed an event object, not an element.

Use this.setAttribute(...) instead. this refers to the element the handler is bound to.

Note that element.setAttribute("onclick", ""); won't remove the event handler you add via addEventListener, use removeEventListener instead:

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

You can learn more about event handling on quirksmode.org and MDN.

Event handlers give a event property to the callback function. The element you're looking for can be found in event.target.

So the function becomes:

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

By the way, you can also use event.target.href = … and setting event handers is better done with addEventListener instead of setting onclick, like you do in another part of your code.