Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations wOOdy-Soft on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Issue with document.body.innerHTML not being set properly, 2

Status
Not open for further replies.
bizrat

bizrat

Programmer
May 13, 2004
10
US
Is there a problem with setting document.body.innerHTML?

My code does the following:

var bodyText = document.body.innerHTML;
document.body.innerHTML = "";
document.body.innerHTML = bodyText;

At first innerHTML is set to "<A name=top><script language=Javascript1.2>start_menu();</script>xxxxx..."

In a debugger I see that bodytext is set the proper string.
Next I see innerHTML = "" and bodyText is still correct.
Finally bodyText is still correct but innerHTML is set to "<A name=top>xxxxx..."

Why was the <script> part removed?


 
Sort by date Sort by votes
document.body.innerHTML = ... replaces everything between BODY and /BODY. Here is lab example:
Code: 
<body>
<input type="button" onclick="blah()" value="Test">
<script language="javascript">
function blah()
{	with( document.body )
	{	alert( innerHTML );
		innerHTML = "Some <b>HTML</b> to replace body";
		alert( innerHTML );
	}
}
</script>
</body>
Migrate javascript into HEAD or embed page into DIV and change DIV.innerHTML.
 
Upvote 0 Downvote
works properly in IE6 & firefox on winXPpro for me...

Code: 
<html>
	<head>
		<title>test</title>
		<script type="text/javascript">
			function start_menu() {
				return true;
			}
			
			function doit() {
				var t = document.body.innerHTML;
				alert(t);
				document.body.innerHTML = "";
				alert("...");
				document.body.innerHTML = t;
				alert(document.body.innerHTML);
			}
		</script>
	</head>

	<body>
		<form>
			<A name=top><script language=Javascript1.2>start_menu();</script>
			xxxxx
			</a>
			<p>paragraph<p>
			<input type="button" class="" value="doit();" onclick="doit();" />
		</form>
	</body>
</html>


=========================================================
-jeff
try { succeed(); } catch(E) { tryAgain(); } finally { rtfm(); }
 
Upvote 0 Downvote
Strange... I moved <script> into body and sometimes it becomes stripped out depending on location (IE6).
 
Upvote 0 Downvote
I tried your script and it works. I retried mine and it didn't.

Could Javascript code be trashing memory? The other JS is a "borrowed" mm_menu system written in 2002. Could it be causing the problem?

Any ideas would be greatly appreciated.
 
Upvote 0 Downvote
perhaps there's a better way...explain what you're trying to do / why you're trying to do it



=========================================================
-jeff
try { succeed(); } catch(E) { tryAgain(); } finally { rtfm(); }
 
Upvote 0 Downvote
The site is written in PHP but is mostly hardcoded. I have a search tool that finds the pages matching the criteria. When the page is displayed, I want to highlight the area on the page that match. I got the JS from the web. It works except it strips out the <script> field. The other JS is a menu system. It I run either script by themeselves, they appear to run.

The highlight JS was taken from I am only using doHighlight() and highlightSearchTerms(. I made no changes.
 
Upvote 0 Downvote
OK... try this. Instead of rewriting body.innerHTML, it affects only text nodes containing search pattern:
Code: 
<style type="text/css">
.blah{	background-color: #ffcb66; color: #000000;	}
</style>

<script language="javascript">
var sHighlightClass, oReg;
var oTran = new Array;
oTran[">"] = "&gt;"
oTran["<"] = "&lt;"
oTran[" "] = "&nbsp;"

function highlightSearchTerms( sText, sClass )
{	oReg = new RegExp;
	oReg.compile( "(" + sText + ")", "ig" );
	sHighlightClass = sClass;
   highlightSearchRecursive( document.body );
}

function highlightSearchRecursive( oDOMNode )
{	for( var i=0; i< oDOMNode.childNodes.length; i++ )
	{	oChild = oDOMNode.childNodes[i];
		if (oChild.nodeType==3)
		{	sText = oChild.nodeValue;
			if (sText.search( oReg ) > -1)
			{	sText= oChild.nodeValue.replace( /^ |[<>]/g, entityConvert );
				oSpan = document.createElement("SPAN");
				oSpan.innerHTML = sText.replace( oReg, "<span class='" + sHighlightClass + "'>" + "$&" + "</span>" );
				oDOMNode.replaceChild( oSpan, oChild );
			}
      }
		else	highlightSearchRecursive( oChild );
	}
}

function entityConvert( sPart ){	return( oTran[sPart] );	}
</script>
(checked in IE6/ff0.8. Bugs included, comments welcomed).
 
Upvote 0 Downvote
AFAIK NavigateAndFind() works like Ctrl-F - it highlights only first match. And prior to IE5.5 it was potential security hole.
 
Upvote 0 Downvote

I have no idea how it works - only found it a few days ago ;o)...

Not sure how it could be considered a security risk... Surely all it's doing is no different to a "window.open" and then a highlight script?

Dan
 
Upvote 0 Downvote
Thanks to all! Vongrunt's code works well. I made a small revision to highlight the words individually. No big deal but here it is:

function highlightSearchTerms( sText, sClass )
{
oReg = new RegExp;
sta = sText.split(" ");

for (var i = 0; i < sta.length; i++) {
oReg.compile( "(" + sta + ")", "ig" );
sHighlightClass = sClass;
highlightSearchRecursive( document.body );
}
}

The rest is the same.
 
Upvote 0 Downvote
This is a great function - is there anyway I can limit this further so that it only highlights keywords in a specified block of text? I've put a DIV tag around the text I would like this function to apply to but I can't seem to modify the code to search just the text in the DIV tag. Any ideas?

~tg
 
Upvote 0 Downvote
Code: 
function highlightSearchTerms( sText, sClass )
{
    oReg = new RegExp;
    sta = sText.split(" ");
    
    for (var i = 0; i < sta.length; i++) {
        oReg.compile( "(" + sta[i] + ")", "ig" );
        sHighlightClass = sClass;
        highlightSearchRecursive( [red]document.getElementById('hilight')[/red] );
    }
}

--Chessbot

There is a level of Hell reserved for probability theorists in which every monkey that types on a typewriter produces a Shakespearean sonnet.
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

TheLazyPig
  • Locked
  • Question
Buttons not aligned after another button is clicked
Replies
2
Views
415
gmmastros
gmmastros
JScannell
  • Locked
  • Question
Javascript issue on iPhone/iMac platforms
Replies
0
Views
785
JScannell
JScannell
JPSeo
  • Locked
  • Question
Another cjhild_process.exec issue with complex shell command
Replies
0
Views
223
JPSeo
JPSeo
waubain
  • Locked
  • Question
id tag not loading new data with new ajax call 1
Replies
4
Views
387
waubain
waubain
edgarv
  • Locked
  • Question
Field with numbers and characters get nan
Replies
1
Views
371
ggriffit
ggriffit

Part and Inventory Search

Sponsor

Back
Top