Replacing tab characters in JavaScript

Question

Please consider the following HTML <pre> element:

This is some  
example code which    
     contains tabs

I would like to replace all of the tab characters with four non-breaking space characters in HTML (i.e. &nbsp;). I have tested the above pre element with JavaScript for the presence of tab characters as follows:

$('pre').ready(function() {
    alert(/\t/.test($(this).text()));
});

But it is always returned false. Can anyone tell me the correct process by which to replace tab spaces from the source code to HTML NBSPs? The tabs have been added by Komodo Edit, and are visible when viewing the source.

Answer 1

You can do it like this:

$('pre').html(function() {
    return this.innerHTML.replace(/\t/g, '    ');
});

That will loop through all pre elements on the page and call the function for each of them. jQuery's html function uses the return value of the function we give to replace the content of each element. We're using String#replace to replace all (note the g flag on the regexp) tab characters in the HTML string with four non-breaking spaces.

Live example