Services Products About Us Case Studies Clients
Modern Signal
Modern Signal Home Page
Lighthouse on beach Products
Offering a full range of development services: strategy, design, application programming, database development
News & Recents Projects
Use Javascript to Link All Email Addresses in a Page
Posted by David Hammond, 2/14/2008

This came up with a site that needed to have a mailto link for email addresses, but other methods of linking the value didn't work. The same basic method could be used to replace any text in a page.

<script type="text/javascript">
//Match email addresses not within tag attributes
var re = /[\w\.\-]+\@([\w\-]+\.)+[\w]{2,4}(?![^<]*>)/ig;

//Function to do replace
function linkEmails(parentNode){
    var nodes = parentNode.childNodes;
    for (var i=0; i < nodes.length; i++){
        //For element nodes other than A nodes, search children
        if (nodes[i].nodeType == 1 && nodes[i].tagName != "A") {
            linkEmails(nodes[i]);

        //For text nodes that match, do replace for parent node.
        } else if (nodes[i].nodeType == 3 && re.test(nodes[i].nodeValue)) {
            parentNode.innerHTML = parentNode.innerHTML.replace(re,"<a href='mailto:$&'>$&</a>")
        }
    }
}

//Set onload event to do replace
window.onload = function(){
    linkEmails(document.body);
}
</script>

I think most of the above code is relatively easy to understand by following the comments I have included, but it could be useful to break down that regular expression to see what it's doing.  The first part matches the email address:
[\w\.\-]+\@([\w\-]+\.)+[\w]{2,4}
The next part uses somewhat more advanced regular expression syntax:
(?![^<]*>)
The (?!...  notation says that the email address will only match is it is not followed by [^<]*>, which should ensure that it is not within a property of an html tag.


July 15, 2008 --

PSLawNet is an online resource for law students and lawyers, containing extensive information on public interest careers and organizations.  The site launched with new and redeveloped features including online job applications, favorites for job postings and organizational profiles, email alerts, and a full CMS to manage site members and content. -View-
May 22, 2008 --

Launch of System Integrators website, which includes a new design, CMS lite to edit content in certain sections, and a tool to manage internal documents and employee access.

May 13, 2008 --
Chlopak, Leonard, Schechter & Associates site launches with a new design and full content management system, along with client extranet tools, job opportunities and resume' submissions.
April 2008 --

Corporate Apartment Specialists, Inc. site launches with a new design and full content management system, as well as robust tools to manage property records and site visitor information requests.
April 2008 --

Designed by Burka Studios and developed by Modern Signal, Monday Properties website launches with properties portfolio, news releases, client projects extranet, job opportunities and resume' submissions and a content management system.
March 7, 2008 --
http://www.JBGR.com
JBGR website release with new design, interactive properties map, Google Maps integration, and content management system. (developed w. Burka Studios)
January 30, 2008 --
Smart Payroll Solutions website release featuring a CMS, and professional organization services such as timesheet tools, HR document retrieval and form submissions.
January 14, 2008 --

New site launched for America's Choice featuring new design and content management system.