...

View Full Version : Help with an array?



ramblinwreck
12-11-2011, 07:19 PM
(cue bouncy piano rendition of "If I Only Had A Brain".......)

I have a style:



.red1{background-color:red;}


and a function which, when called, highlights certain keywords in an
HTML document:



function hiFruit() {
xx=document.body.innerHTML;
yy=xx.replace(/apple/gi,'<span class=red1>apple</span>')
.replace(/orange/gi,'<span class=red1>orange</span>')
.replace(/banana/gi,'<span class=red1>banana</span>');
xx=yy;
document.body.innerHTML=xx;
void 0
}


I have to assume, from my *very* limited understanding of javascript,
that the above function could handle a fairly large number of keywords
much more efficiently --- *if* I pulled the keywords from an array.

I'm hoping that, in your near-infinite mercy for fellow seekers just
starting out on the JS path, you could provide some simple example of
such an array as it applies to this specific type of situation.

And, just so you know, this isn't homework, I haven't been a student for
60 years, I don't even have a website. I'm just an old guy trying to pass
some long nights self-teaching himself a little scripting so he can build
some little toys to run in his browser.

And I would be grateful for *any* input. I grasp the general *idea* of
arrays, but...... well, apparently, it IS hard to teach an old dog new tricks.

(But, man, this javascript stuff sure is FUN!)

Old Pedant
12-11-2011, 07:35 PM
Actually, the most efficient way to do this is to build a *single* regexp to do it:


yy = xx.replace(/(apple|orange|banana)/gi, '<span class="red1">$1</span>');

So you could just put all your words into a long string with | separators:


var words = "apple|orange|banana";
var re = new RegExp( "(" + words + ")", "gi" );
yy = xx.replace( re, '<span class="red1">$1</span>');

or you could simply join from an array:


var words = ["apple","orange","banana"];
var re = new RegExp( "(" + words.join("|") + ")", "gi" );
yy = xx.replace( re, '<span class="red1">$1</span>');

So pick your poison.

Now a question for you: What the heck is

void 0
????



// possible final version?
var words = ["apple","orange","banana"]; // could build this up by reading from a file, maybe?

function hiFruit() {
var re = new RegExp("(" + words.join("|") + ")", "gi" );
document.body.innerHTML =
document.body.innerHTML.replace(re,'<span class="red1">$1</span>');
}

DaveyErwin
12-11-2011, 07:38 PM
seems to work ?


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<script>
function init(){
xx=document.body.innerHTML;
yy=xx.replace(/apple/gi,'<span class=red1>apple</span>')
.replace(/orange/gi,'<span class=red1>orange</span>')
.replace(/banana/gi,'<span class=red1>banana</span>');
xx=yy;
document.body.innerHTML=xx;
void 0// what's this for ?
}
</script>
<style>
.red1{background-color:red}
</style>
</head>
<body onload="init()">

<div id="container">

banana orange avacado
</body></html>

Old Pedant
12-11-2011, 08:10 PM
Oh, Davey! That will *NEVER* work.

There's no such thing as "avacado".

It's "avOcado".

<snicker/>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum