Is there any Chrome extension, by which I would be alerted by auto highlight when my keyword is found on a page?

Question

Is there any Chrome extension, by which I would be alerted by auto highlight when my keyword is found on a page?

I do not want to use crtl+f every time.

Answer 1

Here's another user script which doesn't need jQuery, supports case-insensitive regexp matching and actually highlights the specific words you want to match:

// ==UserScript==
// @name           Keyword Highlight 2
// @author         Ilmari Karonen
// @namespace      http://superuser.com/questions/467276
// @include        http://*
// ==/UserScript==

// Edit this regexp to match what you want highlighted; don't forget the "g" flag!
var r = /Chrome/ig;

// This span will be used to wrap the highlighted text:
var span = document.createElement( 'span' );
span.style.backgroundColor = 'yellow';

// Pre-create some other handy objects for later:
var text = document.createTextNode( '' );
var frag = document.createDocumentFragment();

// Walk the document body node by node:
var e = document.getElementsByTagName( 'body' )[0];
while ( e ) {
    // If it's a text node, match it against the regexp:
    if ( e.nodeType == Node.TEXT_NODE ) {
        var t = e.textContent, i = 0, m;
        while ( (m = r.exec( t )) !== null ) {
            // Copy any text before the match into the fragment:
            text.textContent = t.substring( i, m.index );
            frag.appendChild( text.cloneNode( true ) );
            // Wrap the match in a span and copy it into the fragment:
            span.textContent = m[0];
            frag.appendChild( span.cloneNode( true ) );
            // Keep track of the current match position:
            i = m.index + m[0].length;
        }
        if ( i > 0 ) {
            // Remove the matched text from e and re-insert it before it:
            e.textContent = t.substring( i );
            e.parentNode.insertBefore( frag, e );
            // Reset frag to a new empty fragment:
            frag = frag.cloneNode( false );
        }
    }
    // Advance to next node in DOM (bugfix: skip textarea content):
    var n = e.firstChild;
    if ( /^(head|title|script|style|textarea)$/i.test( e.tagName ) ) n = null;
    while (!n && e) {
        n = e.nextSibling;
        e = e.parentNode;
    }
    e = n;
}

Obligatory screenshot:

Answer 2

You could use a user script like the following:

// ==UserScript==
// @name           Keyword Info
// @namespace      SuperUser 467276
// @include       http://*
// ==/UserScript==

function addJQuery(callback) {
  var script = document.createElement("script");
  script.setAttribute("src", "//code.jquery.com/jquery-latest.min.js");
  script.addEventListener('load', function() {
    var script = document.createElement("script");
    script.textContent = "jQuery.noConflict();(" + callback.toString() + ")();";
    document.body.appendChild(script);
  }, false);
  document.body.appendChild(script);
}


function main() {
  jQuery('*:contains("chrome")').each(function(){
     if(jQuery(this).children().length < 1) 
          jQuery(this).css("background-color", "yellow") });
}

addJQuery(main);

This will highlight all elements (not just the matching text, as HTML doesn't work like that) that directly contain case-sensitive matches for the search string, chrome in the example.

This solution uses the jQuery inclusion code from this Stack Overflow question. There might be problems with sites already including jQuery; you might be more successful with other solutions.

Screenshot: