[WEB4LIB] Dynamic HTML and highlighting

Wed Dec 8 10:41:23 EST 2004

Here's one way to go, at least for Gecko browsers (IE would probably need
some "document.all" kind of mechanism).

- Kevin

Kevin Broun
Senior Web Developer
National Cancer Institute

----------------------------------------

<html>
<head>
	<title>setBGColor test</title>
	<script type="text/javascript">
	function setBGColor()
	{
		var theSpans = document.getElementsByTagName("span");
		for (var thisSpan in theSpans) {
			if (!isNaN(thisSpan) &&
theSpans[thisSpan].getAttribute("class") == "person") {
				theSpans[thisSpan].style.backgroundColor =
"red";
			}
		}
	}
	</script>
</head>

<body>
<h3>setBGColor test</h3>

<p>Plain old text</p>

<p>a <span>paragraph</span> with some names in it like <span
class="person">John Doe</span> and <span class="person">James
Smith</span>.</p>

<p>Click to <a href="javascript:setBGColor();">test the script</a>!</p>

</body>
</html>

-----Original Message-----
From: John Fitzgibbon [mailto:jfitzgibbon at Galwaylibrary.ie]
Sent: Wednesday, December 08, 2004 6:27 AM
To: Multiple recipients of list
Subject: [WEB4LIB] Dynamic HTML and highlighting

Hi,

=20

I have created a HTML document with people's names marked up as follows
<span class=3D"person">John Doe</span>.

=20

I wish to allow users to highlight all names on the web page by ticking
a checkbox labeled 'Highlight'.

=20

I can use JavaScript to dynamically change the background color of an
element using 'onclick=3D"this.style.backgroundColor=3D"' If I am seeking=
=20to
reference all span elements in the document with an attribute of class
whose value is person how do I proceed? Is it possible?

=20

All ideas are welcome.

=20

Regards

John