Note: After saving, you have to bypass your browser's cache to see the changes. Google Chrome, Firefox, Microsoft Edge and Safari: Hold down the ⇧ Shift key and click the Reload toolbar button. For details and instructions about other browsers, see Wikipedia:Bypass your cache.
//This script uses material serived from Wikipedia user Evad37's script "duplinks-alt" ( https://en.wikipedia.org/wiki/User:Evad37/duplinks-alt.js ), which is released under the Creative Commons Attribution-Share-Alike License 3.0 ( http://creativecommons.org/licenses/by-sa/3.0/ )
$( function($) {
    if( (mw.config.get('wgNamespaceNumber') != 0) && (mw.config.get('wgNamespaceNumber') != 2)) {
        // only check in mainspace and userspace (for userspace drafts)
        return;
    }
    var portletlink = mw.util.addPortletLink('p-tb', '#', 'Highlight hard spaces', 'ca-showharspaces');
    $(portletlink).click( function(e) {
        e.preventDefault();
        mw.util.addCSS(".hardspace { border: 1px solid #bbb; background: #ddd; color: #fff }");                      //CSS style for replacment strings
        var highlight = function() {
            var contents = $(this).html();                                                 // get html contents
            for (ii = 0; ii<1000; ii++) {                                                   // repeat up to 1000 times
                contents = contents.replace("&nbsp;", "<span class=hardspace>•</span>");   // perform the (i)th replacement
                contents1 = contents.replace("&nbsp;", "<span class=hardspace>•</span>");  // perform the (i+1)th replacement
                if (contents == contents1) break;                                          // break out of loop if next replacement doesn't change anything
            }
            $(this).html(contents);
        };
        mw.util.$content.find('*').each(highlight);                                        // run on each <p>aragraph of the body
    });
});