You must have Javascript enabled to experience this site.

Hide your email address from spam bots

Posted & filed under Coding Tips.

Use JavaScript and jQuery to hide your email address.

If you have your email address on your website, spam bots can harvest it by page scraping. Using just a few lines of JavaScript your address can be hidden from these nasties. This works because the spam bots only scrap the HTML without following all of the JavaScript, so in the HTML we have a placeholder that is replaced by a script later.

 

hide_email.html

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Hide email address from spam bots</title>
  </head>
  <body>
    <p id="contact-emailto">
      This is my email address <span>- but only if you have JavaScript enabled.</span>
    </p>
 
    <!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if offline -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
       window.jQuery || document.write('<script src="js/libs/jquery-1.8.1.min.js"></script>')
    </script>
    <script src="hide_email.js" type="text/javascript"></script>
  </body>
</html>

 

hide_email.js

/* replace hidden email text */
function add_email() {
    var addr = 'info
@paulshipley.id.au';
    var email = '<a href="mailto:' + addr + '?Subject=Paul%20Shipley%20Services">' + addr + '</a>';
    jQuery('span','#contact-emailto').replaceWith( email );
};

jQuery(document).ready(function($) {
    add_email();
});

 

If you load these with JavaScript enabled you get

This is my email address info@paulshipley.id.au

 

If instead you disable JavaScript you get

This is my email address - but only if you have JavaScript enabled.

 

 

 

 

 

4 views