473,326 Members | 2,114 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,326 software developers and data experts.

removeNode() for a dynamic div doesn't work in firefox

hi,
i have a javascript function to highlight google search keywords in the
page. it works well on IE and mozilla browsers. for the page OnLoad, i
call the Highlight() method, and that highlights the words in the page, and
inserts a div element with the message: "your search terms have been
highlighted..." and a link to remove the highlighting, which has
href='javascript:removeHighlight(..)', but that only works in IE, not
firefox 1.0.

am i using an IE-only javascript feature? the code from the javascript file
is below, and if you'd like to see it in action, go to
http://www.google.ie/search?num=100&...software+iserc and
click the first link (at time of writing it is www.iserc.ie/diary/2004/
november5isercworkshopadaptivesoftware/) . you need to go through google to
get the referrer. you should see the message at the top when the page
loads, and clicking the link should remove the highlighting and message.

i've done as much debugging as i can, and the RemoveHighlight function is
executing, and it does return the HighlightMsg div with the getElementByID
function correctly. it's just that RemoveNode does nothing to it for
firefox, but it works in IE.

thanks for any help
tim mackey. code below.

function Highlight(element)
{
...
//Replace search words
var msg = "<div id='HighlightMsg'>Your search terms have been highlighted:
";
var color = 0;
var max = 5;
for(j=0; j<aWords.length; j++)
{
regexp= new RegExp ("(" + aWords[j] + ")", "gi");
vStrippedHTML = vStrippedHTML.replace(regexp,'<span class="hl' + color+
'">$1</span>');
// build up message notifying user of highlighting
msg = msg + "<span class='hl" + color+ "'>" + aWords[j] + "</span> ";
color++;
}
//Reinsert HTML
for(i=0;vStrippedHTML.indexOf("$!$") > -1;i++)
vStrippedHTML = vStrippedHTML.replace("$!$", vHTMLArray[i]);
msg = msg + " - <a
href='javascript:RemoveHighlight(document.getEleme ntById(\"HTML\"))'>Remove
Highlighting</a></div>";
element.innerHTML = msg + vStrippedHTML;
}

function RemoveHighlight(element)
{
document.getElementById("HighlightMsg").removeNode (true);
regexp=/(<span class\=hl\d>)([^<>]*)(<\/span>)/ig;
element.innerHTML = element.innerHTML.replace(regexp, "$2");
}
window.onload=function(){Highlight(document.getEle mentById("HTML"));};


\\ email: tim at mackey dot ie //
\\ blog: http://tim.mackey.ie //
67d0ebfec70e8db3
Jul 23 '05 #1
3 13519


Tim Mackey wrote:
a link to remove the highlighting, which has
href='javascript:removeHighlight(..)', but that only works in IE, not
firefox 1.0.
function RemoveHighlight(element)
{
document.getElementById("HighlightMsg").removeNode (true);
Mozilla doesn't know a removeNode method, you probably want
var el = document.getElementById("HighlightMsg");
el.parentNode.removeChild(el);
regexp=/(<span class\=hl\d>)([^<>]*)(<\/span>)/ig;
element.innerHTML = element.innerHTML.replace(regexp, "$2");


I haven't looked at that deeply but innerHTML manipulation is a gamble,
it seems your regular expression expects the class attribute value to
not be quoted, IE might give innerHTML that way, but Mozilla might have
the value quoted so you need to write a regular expression catering to
both ways.

--

Martin Honnen
http://JavaScript.FAQTs.com/
Jul 23 '05 #2


Martin Honnen wrote:

it seems your regular expression expects the class attribute value to
not be quoted, IE might give innerHTML that way, but Mozilla might have
the value quoted so you need to write a regular expression catering to
both ways.


The following regular expression might do that:
var regExp = /<span class=("?)h1\d+\1>([^<>]*)<\/span>/gi;
but I haven't tried to intergrate it in your innerHTML manipulation code.
--

Martin Honnen
http://JavaScript.FAQTs.com/
Jul 23 '05 #3
martin you are a genius. i implemented both your suggestions and it works
perfectly now. thanks!

for anyone who wants to use the code, (it works quite nicely because there
is no server side processing), i have included the updated version below.
just save it into a .js file, and include it in any pages that you want to
support keyword highlighting.

function Highlight(element)
{
var aWords;
var ref = document.referrer;
if(ref == null || ref == "")
return;
var sets = ref.split('&');
for(i=0; i<sets.length; i++)
if(sets[i].indexOf("q=") > -1)
aWords = sets[i].split('=')[1].split('+');
if(aWords == null || aWords.length == 0)
return;
//Extract HTML Tags
regexp=/<[^<>]*>/ig;
vHTMLArray = element.innerHTML.match(regexp);
//Replace HTML tags
vStrippedHTML = element.innerHTML.replace(regexp,"$!$");

//Replace search words
var msg = "<div id='HighlightMsg'>Your search terms have been highlighted:
";
var color = 0;
var max = 5;
for(j=0; j<aWords.length; j++)
{
regexp= new RegExp ("(" + aWords[j] + ")", "gi");
vStrippedHTML = vStrippedHTML.replace(regexp,'<span class="hl' + color+
'">$1</span>');
// build up message notifying user of highlighting
msg = msg + "<span class='hl" + color+ "'>" + aWords[j] + "</span> ";
color++;
}
//Reinsert HTML
for(i=0;vStrippedHTML.indexOf("$!$") > -1;i++)
vStrippedHTML = vStrippedHTML.replace("$!$", vHTMLArray[i]);
msg = msg + " - <a
href='javascript:RemoveHighlight(document.getEleme ntById(\"HTML\"))'>Remove
Highlighting</a></div>";
element.innerHTML = msg + vStrippedHTML;
}

function RemoveHighlight(element)
{
var msgDiv = document.getElementById("HighlightMsg");
msgDiv.parentNode.removeChild(msgDiv);
regexp=/(<span class\="?hl\d"?>)([^<>]*)(<\/span>)/ig;
element.innerHTML = element.innerHTML.replace(regexp, "$2");
}
window.onload=function(){Highlight(document.getEle mentById("HTML"));};

Jul 23 '05 #4

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

4
by: Andrew Poulos | last post by:
I'm using the following code to dynamically build an OBJECT tag to display a QuickTime movie: window.onload = function() { addParam = function(p,n,v) { /* parent, name, value */ var c =...
5
by: DanielEKFA | last post by:
Hey hey hey :) I'd like to do a .js include each X seconds, to update an array (the .js is really a .php file which generates the javascript dynamically). Just like <script...
1
by: Toby Miller | last post by:
I have this form validation that I'm trying to build, but it's not working properly. A dynamic function to the onsubmit event for a form. the result of that function (true/false) should then be...
5
by: steve.macleod | last post by:
Hi, I am using removeNode() to remove a table (tbody) from the document like this: the_table = document.getElementById(the_table_id); the_table.removeNode(true); However when I access the...
45
by: Pat | last post by:
its seems asp.net validation doesn't fire when using FireFox? Tested a page and it doesn't fire. It seems the javascript doesn't fire Any ideas?
9
by: pbd22 | last post by:
Hi. This is just a disaster management question. I am using XMLHTTP for the dynamic loading of content in a very crucial area of my web site. Same as an IFrame, but using XMLHTTP and a DIV. I...
1
by: SunshineInTheRain | last post by:
The following code is dynamic create dropdownmenu which data within pulled from database However, the code work well on IE but not on Firefox. On Firefox, the whole mouseover and mouseout function...
2
by: pinson.nick | last post by:
I've been playing around with dynamic tables for the last couple days and have run into some interesting issues. I know how to work around this issue, but was wondering if anyone had any insight as...
19
by: Rabel | last post by:
I have a page that is using tables (please no comments about this - I understand it should be css but firefox created this template) I have a menu down the left side and the bottom is supposed to...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
1
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.