Networking | Hardware | Software | Multimedia | System | Unix&Linux | MBA

Home>>Hardware>>Use script to change external html before it is executed

Use script to change external html before it is executed

Flower of Fire
12-02-2004, 12:39 AM
I am the webmaster of www.balticbasket.dk where I use a CMS that allows me to run my own Javascript and html-code (but not any other, nor server side languages like ASP) besides the more normal functions of the sites using this system. I have inserted an event calendar using input from another URL (the service provider from this URL has produced a small script that allows this):


><!-- Groupcare.dk list of events component (start) -->
<STYLE><!--
.textblack {color: #0000cc; font-family: Tahoma; font-size: 8pt; line-height: 10pt}
.textblack a {color: #0000cc}
.textred {color: #990000; font-family: Tahoma; font-size: 8pt; line-height: 10pt}
.textwhite {color: #ffffff; font-family: Tahoma; font-size: 8pt; line-height: 10pt}
.textwhite a {color: #ffffff}
.textsmallblack {color: #0000cc; font-family: Tahoma; font-size: 8pt}
.textlargeblack {color: #0000cc; font-family: Tahoma; font-weight: bold; font-size: 8pt}
.subtabheader {color: #ffffff; font-family: Tahoma; font-size: 8pt; margin-right: 2px; padding: 3px}
.frame {width: 120pt border: 0px solid #cccccc; background-color: #cccccc; padding: 0px}
--></STYLE>

<SCRIPT></SCRIPT>

<SCRIPT src=http://www.codingforums.com/archive/index.php/"http://www.groupcare.dk/da/comp/events.asp?groupid=486073&days=7" var></SCRIPT>
<!-- Groupcare.dk list of events component (slut) -->


This works fine, but I want to emphasize when an event is cancelled, by changing fontcolor to red whenever the word "cancelled" appears.
My strategy would be to
- read the html from groupcare.dk as a variable
- search for string and change color
- execute html

But I'm a newb at Javascript, and even some of my friends, that are more or less professional developers can not provide the help I need.
So if you have any suggestions, it would be highly appreciated.

Regards
FoF

adios
12-02-2004, 05:56 AM
Hi f-o-f...

From an idea by Mike Foster (http://www.sitepoint.com/forums/showthread.php?t=138899&highlight=document.write) -


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>untitled</title>
<base href=http://www.codingforums.com/archive/index.php/"http://www.balticbasket.dk/" />
<LINK rel="stylesheet" type="text/css" href=http://www.codingforums.com/archive/index.php/"admin/utils/stylesheets/global.css">
<LINK rel="stylesheet" type="text/css" href=http://www.codingforums.com/archive/index.php/"admin/utils/stylesheets/default.css">
<style type="text/css">

.textblack {color: #0000cc; font-family: Tahoma; font-size: 8pt; line-height: 10pt}
.textblack a {color: #0000cc}
.textred {color: #990000; font-family: Tahoma; font-size: 8pt; line-height: 10pt}
.textwhite {color: #ffffff; font-family: Tahoma; font-size: 8pt; line-height: 10pt}
.textwhite a {color: #ffffff}
.textsmallblack {color: #0000cc; font-family: Tahoma; font-size: 8pt}
.textlargeblack {color: #0000cc; font-family: Tahoma; font-weight: bold; font-size: 8pt}
.subtabheader {color: #ffffff; font-family: Tahoma; font-size: 8pt; margin-right: 2px; padding: 3px}
.frame {width: 120pt border: 0px solid #cccccc; background-color: #cccccc; padding: 0px}

.alert {color: #f00;}
.time {font-weight: bolder;}
.month {font-size: larger; color: #900;}

</style>
</head>
<body>
<TABLE class=paragraph style="MARGIN: 0px; WIDTH: 219px" cellSpacing=2 cellPadding=2 border=0>
<TBODY>
<TR>
<TD vAlign=top><IMG style="WIDTH: 219px; HEIGHT: 30px" height=30 src=http://www.codingforums.com/archive/index.php/"../../../billeder/kalender.jpg" width=180 border=0>
<DIV class=paragraph>Kalenderen dækker de fleste aktiviteter i Baltic Basket. Prøv ogs?<A class=link href=http://www.codingforums.com/archive/index.php/"default.asp?pageid=198">60-dages-kalenderen</A>.
</DIV>
</TD>
</TR>
<tr>
<td>
<!-- Groupcare.dk arrangementsliste komponent (start) -->
<script type="text/javascript">

var dwrite = document.write; //save reference
document.write = function(str) //over-write
{
str = str.replace(/(udekamp)/gi, '<span class="alert">$1</span>'); //red udekamps, neat
str = str.replace(/(\b\d{1,2}:\d{1,2})/g, '<span class="time">$1</span>'); //strong dates
str = str.replace(/(December)/gi, '<span class="month">$1</span>'); //emphasize month
document.write = dwrite; //restore original
document.write(str); //use it
}

</script>
<SCRIPT src=http://www.codingforums.com/archive/index.php/"http://www.groupcare.dk/da/comp/events.asp?groupid=486073&amp;days=7"></SCRIPT>
</td>
</tr>
</TBODY>
</TABLE>
</body>
</html>


Hijacks the document.write method long enough to grab the downloaded string, then marks it up and spits it out.

Wish I'd thought of that.... :(

Flower of Fire
12-02-2004, 09:58 AM
I didnt have high hopes getting excactly what I wanted, but this is it.
Many thanks for that.

FoF

Willy Duitt
12-02-2004, 03:11 PM
Interesting stuff... :thumbsup:
This should find its way to the Post a Javascript forum for the archives...


 

TOP

For more info

setting a minimum size
Auto Preview of Image 
Refresh with a query s
JS Validation obsolete
Javascript Pop up func
Slide show transitions
I'm a newbie...please!
how to write coding in
Advanced Debug Info 
.js file doesn't work 

News Archive

Adding Graphic To Text
re-direct form after s
pop up window controls
Clock on homepage - He
passing a param from a
Password Procection wi
document.title in same
focus onload 
Counting Wrong from Ri
Help needed on how to 

Related stories:

Turning Scripting Off in IE
How to change base href using variables.
problem submitting to servlet
Menu issues
Help! How to include multiple js files in one line
Fruit Machines
Forcing a parent window to reload

Copyright@2004-2005 www.zzcoke.com All Right Reserved

advanced web statistics