WonderCMS community

Posted: **Mon Feb 07, 2022 8:41 pm**

I would also probably go with a separate script file instead of the inline javascript.
Give all the A elements a class name, eg "mail" and then use something like this:

Code: Select all

// shortcut to use "d" as document (defined in the last line)
(d => {
    // select all instances of A with classname "mail"
    const mailz = d.querySelectorAll('a.mail');
    // let's loop those items
    mailz.forEach(cur => {
        cur.addEventListener('click', function() {
            this.href = this.href.replace(/AT/, '@').replace(/DOT/g, '.');
        });
    });
})(document);

Posted: **Sat Feb 12, 2022 1:13 am**

Small addition which i thought might be interesting to know..

What we are using here is called an IIFE.

An IIFE (Immediately Invoked Function Expression) is a JavaScript function that runs as soon as it is defined.

Code: Select all

(function() {
    return;
})();

This makes it so we don't have to define a function to run our code.

Code: Select all

function Stuff() {
    ...;
}
Stuff();

Also it's using arrow function syntax, which does stuff different contextually.
https://developer.mozilla.org/en-US/doc ... _functions

Code: Select all

var fn = (stuff) => {
    ...;
}

Posted: **Sat Feb 12, 2022 7:12 am**

Thanks for this. I'm a little distracted with other projects currently. Will report as soon as I return to working on my WonderCMS site.

WonderCMS community

[SOLVED] Cloaking Email Addresses

Re: [SOLVED] Cloaking Email Addresses

Re: [SOLVED] Cloaking Email Addresses

Re: [SOLVED] Cloaking Email Addresses