Book Sale! Save 20% on WordPress books with discount code: SAVE20
Web Dev + WordPress + Security

Spamless Email Address via JavaScript

[ Mr. T ] Let’s face it, spam sucks. Give spammers the figurative finger by using this nifty bit of JavaScript to hide your email address from the harvesters. Here is an easy copy-&-paste snippet for including a spam-proof email address in your web pages. Although there are a million ways of doing this, I am posting this for the record (and because I just can’t stand deleting usable code). This technique uses JavaScript, and therefore is not 100% ideal for all users. My advice would be to include a <noscript> element that contains an image of your email address. That way, users without JavaScript will still have access to your (spam-proof) email address. Of course, image-based text presents issues for text-only browsers, but hey, you gotta start somewhere! ;)

Spamless Email

Secure the function by adding this block of code to the document <head>, or by placing it within an external JavaScript file:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

function email(name, domain, extension) {
   if (!document.write) return false;
   if (document.write) {
      var name; var domain; var extension;
      document.write('<a href="' + 'mailto:' + name + '@' + domain + '.' + extension + '">' + name + '@' + domain + '.' + extension + '<\/a>');
   }
}

//--><!]]>
</script>

Then to replace the three variables with real values, add this to the document body element:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

email("name", "domain", "extension");

//--><!]]>
</script>

Finally, you may also add this line for those without JavaScript:

<noscript><p>(enable javascript or view source to see the email link)</p></noscript>

Or, you may wish to create a text-image of your email address for display on non-JavaScript machines:

<noscript>
   <img src="images/email.gif" alt="Email Address" class="noscript" style="border: 0px;" />
</noscript>

Specific Example

Here is an example of how the function may be configured on an actual web page. This is the specific code that we use at Monzilla Media to hide email addresses from the spam holes:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

function email(m, o, n) {
   if (!document.write) return false;
   if (document.write) {
      var m; var o; var n;
      document.write('<p>Contact: <a href="' + 'mailto:' + m + '@' + o + '.' + n + '?subject=General%20Business" title="Contact">' + m + '@' + o + '.' + n + '<\/a><\/p>');
   }
}

//--><!]]>
</script>

<script type="text/javascript">
<!--//--><![CDATA[//><!--

email("m0n", "monzilla", "biz");

//--><!]]>
</script>

<noscript><p>(enable javascript or view source to see the email link)</p></noscript>

It’s just good times.

Jeff Starr
About the Author
Jeff Starr = Fullstack Developer. Book Author. Teacher. Human Being.
.htaccess made easy: Improve site performance and security.

9 responses to “Spamless Email Address via JavaScript”

  1. Very useful tutorial man was thinking of gaps in my security;
    On a unrelated note how did you code the access menus on top?

  2. Jeff Starr
    Perishable 2008/03/05 3:32 pm

    The access menu located at the top of the page? Good question. Rather than post the process here, I will write a complete tutorial that explains the technique and share it with the community. Thanks for the idea!

  3. Jeff Starr

    ..and done! Check out the hover/access menu tutorial here.

  4. great help!!!!!

  5. I was going to mention this on your more recent Industrial-Strength
    Spamless Email Links article, but comments on that are closed.

    I have no fears about placing my jidanni@jidanni.org email address
    anywhere, as I am a long term SpamAssassin user.

    The one worry is that if I place my jidanni@jidanni.org email address
    here, people could use it to forge comments by me.

    But I’m not going to worry about that. Anyways, I place a zero burden
    on anyone trying to get in touch with me: “customers come first.”

    By the way, I note you have both

    – Contact Jeff via email
    – Contact Jeff via form

    links, however both just lead to the latter, at least here in my
    emacs-w3m (like lynx) browser,

  6. Jeff Starr
    Jeff Starr 2009/02/21 7:36 pm

    Hi jidanni, I have heard of, but have yet to try SpamAssassin. It must be effective if you feel so confident giving out your email in such a bold fashion. Perhaps it’s worth a look..

    As for the duplicate contact links, they are intentional. In JavaScript-enabled browsers, my actual email address is displayed via script. When JavaScript is not available, I use the contact form as a fallback.

    Very attentive! ;)

  7. Well I HAVE NEVER… viewed your site outside of my emacs-w3m text browser, :-)

    Therefore CHECKMATE, your site is not fair and square accessibility-wise :-)

    Not that I can’t just use Firefox… I am just too nerd-like :-)

  8. Jeff Starr
    Jeff Starr 2009/02/21 8:01 pm

    LOL – You got me!! ;)

  9. really good article on spam thanks!!!!

Comments are closed for this post. Something to add? Let me know.
Welcome
Perishable Press is operated by Jeff Starr, a professional web developer and book author with two decades of experience. Here you will find posts about web development, WordPress, security, and more »
GA Pro: Add Google Analytics to WordPress like a pro.
Thoughts
On macOS when an app won’t hide, you can force it by holding the ⌥ (option) key and clicking anywhere on the desktop.
Currently having a blast redesigning Plugin Planet, so much work so little time.
Thanks to David McCan over at WebTNG for the awesome BBQ Pro review.
Enjoyed a nice mini-vacation with my fam. Great way to recharge and regroup.
Nice little interview with yours truly over at ThemeIsle. WordPress, web dev & more!
Perishable Press celebrating 16 years online! An incredible, rewarding journey.
Thanks to Nicholas Ferrell for his excellent and thorough review of Wutsearch search-engine launchpad.
Newsletter
Get news, updates, deals & tips via email.
Email kept private. Easy unsubscribe anytime.