How do I tweak this javascript expression?


J

Jane D

I have got a bookmarklet for use with Opera which highlights all
occurrences of some text in the displayed page. I find it very
useful.

Sometimes I need to use two or three different colours for different
keywords I want highlighting on the same page. I have done this by
changing the original word 'yellow' for other javascript colour
words.

I know next to nothig about javascript. So I would ask if anyone
knows how I can tweak this javascript bookmarklet code (see below) in
two sepearte ways:

(1) So that I can select a color from a list. This may be as simple
as changing the caption to say "enter 1 for lime, 2 for yellow," etc.
or it might be cleverer.

(2) This is mutually exclusive with (1). In this case the
javascript would prompt me to enter a javascript colour keyword (like
"yellow" or colour code like "FF00FF").

Of course, in each case the javascript needs to ask me what i am
searching for!

The javascript is below. Is anyone able to advise on this?

TIA.

Jane
--------------


javascript:(function(){var count=0, text, dv;text=prompt("Search
phrase (yellow):", "");if(text==null ||
text.length==0)return;dv=document.defaultView;function
searchWithinNode(node, te, len){var pos, skip, spannode, middlebit,
endbit, middleclone;skip=0;if( node.nodeType==3
){pos=node.data.toUpperCase().indexOf(te);if(pos>=0){spannode=documen
t.createElement("SPAN");spannode.style.backgroundColor="yellow";middl
ebit=node.splitText(pos);endbit=middlebit.splitText(len);middleclone=
middlebit.cloneNode(true);spannode.appendChild(middleclone);middlebit
..parentNode.replaceChild(spannode,middlebit);++count;skip=1;}}else
if( node.nodeType==1&& node.childNodes &&
node.tagName.toUpperCase()!="SCRIPT" &&
node.tagName.toUpperCase!="STYLE"){for (var child=0; child <
node.childNodes.length;
++child){child=child+searchWithinNode(node.childNodes[child], te,
len);}}return skip;}window.status="Searching for
'"+text+"'...";searchWithinNode(document.body, text.toUpperCase(),
text.length);window.status="Found "+count+"
occurrence"+(count==1?"":"s")+" of '"+text+"'.";})();
 
Ad

Advertisements

R

RobB

Jane said:
I have got a bookmarklet for use with Opera which highlights all
occurrences of some text in the displayed page. I find it very
useful.

Sometimes I need to use two or three different colours for different
keywords I want highlighting on the same page. I have done this by
changing the original word 'yellow' for other javascript colour
words.

I know next to nothig about javascript. So I would ask if anyone
knows how I can tweak this javascript bookmarklet code (see below) in
two sepearte ways:

(1) So that I can select a color from a list. This may be as simple
as changing the caption to say "enter 1 for lime, 2 for yellow," etc.
or it might be cleverer.

(2) This is mutually exclusive with (1). In this case the
javascript would prompt me to enter a javascript colour keyword (like
"yellow" or colour code like "FF00FF").

Of course, in each case the javascript needs to ask me what i am
searching for!

The javascript is below. Is anyone able to advise on this?

TIA.

Jane
--------------


javascript:(function(){var count=0, text, dv;text=prompt("Search
phrase (yellow):", "");if(text==null ||
text.length==0)return;dv=document.defaultView;function
searchWithinNode(node, te, len){var pos, skip, spannode, middlebit,
endbit, middleclone;skip=0;if( node.nodeType==3
){pos=node.data.toUpperCase().indexOf(te);if(pos>=0){spannode=documen
t.createElement("SPAN");spannode.style.backgroundColor="yellow";middl
ebit=node.splitText(pos);endbit=middlebit.splitText(len);middleclone=
middlebit.cloneNode(true);spannode.appendChild(middleclone);middlebit
.parentNode.replaceChild(spannode,middlebit);++count;skip=1;}}else
if( node.nodeType==1&& node.childNodes &&
node.tagName.toUpperCase()!="SCRIPT" &&
node.tagName.toUpperCase!="STYLE"){for (var child=0; child <
node.childNodes.length;
++child){child=child+searchWithinNode(node.childNodes[child], te,
len);}}return skip;}window.status="Searching for
'"+text+"'...";searchWithinNode(document.body, text.toUpperCase(),
text.length);window.status="Found "+count+"
occurrence"+(count==1?"":"s")+" of '"+text+"'.";})();

Hi Jane.

The second option is a lot easier, I'd say...

javascript:(function(){var count=0, text, dv;text=prompt("Search
phrase:", "");hilite=prompt("Hilite
color:", "");if(!hilite)hilite="yellow";if(text==null...

....and:

t.createElement("SPAN");spannode.style.backgroundColor=hilite;middl...

No testing for invalid input, of course. Option (1) might involve a
pop-up window with a listbox...but I'm eating lunch right now.
 
J

Jane D

Hi Jane.

The second option is a lot easier, I'd say...

javascript:(function(){var count=0, text, dv;text=prompt("Search
phrase:", "");hilite=prompt("Hilite
color:", "");if(!hilite)hilite="yellow";if(text==null...

...and:

t.createElement("SPAN");spannode.style.backgroundColor=hilite;mid
dl...

No testing for invalid input, of course. Option (1) might
involve a pop-up window with a listbox...but I'm eating lunch
right now.


That works well! Thank you.

J
 
Ad

Advertisements

J

Jane D

OK guys, I am sorry to be a pain but after I was kindly helped to
tweak some javascript in my Opera bookmarklet, I have found a similar
but much better bookmarklet.

Yes, you guessed it ... I want to get thi snew one tweaked
too! Unfortunately the layout of this new one is completely
different to the first one so I can't use the info people kindly gave
me.

Like the first, this bookmarklet highlights chosen text but with an
important difference. This one tells you how many instances it has
found. This count can be very useful!

Sometimes I need to use two or three
different colours for different keywords which I want highlighting on
the same page. I have done this in my new bookmarklet by changing
the original word 'yellow' for other javascript colour words.

How I can tweak this new javascript bookmarklet code (listed below)
to allow me to select the highlighting color?

As before there are two dialogs with the user:

(1) I can select a color from a list. This may be as simple
as changing the caption to say "enter 1 for lime, 2 for yellow," etc.
or it might be cleverer.

(2) This is mutually exclusive with (1). In this case the
javascript would prompt me to enter a javascript colour keyword (like
"yellow" or colour code like "FF00FF").

The new javascript is below. Is anyone able to advise on this?

Thank you.
Jane



================== JAVASCRIPT ========================

javascript:void(s=prompt('Query:',''));s='('+s+')';x=new
RegExp(s,'gi');rn=Math.floor(Math.random()*100);rid='z' + rn;b =
document.body.innerHTML;b=b.replace(x,'<span name=' + rid + ' id=' +
rid + ' style=\'color:#000;background-
color:lime;\'>$1</span>');void(document.body.innerHTML=b);alert('Foun
d ' + document.getElementsByName(rid).length + '
matches.');window.scrollTo(0,document.getElementsByName(rid)[0].offse
tTop);
 

Top