Shortening HTML with Javascript

I know it is possible, but I don't know how to shorten HTML with JS. Anyone have any ideas for my following code...

Code:

---

<!--MC Radio V2-->
<script type="text/javascript" src="http://www.geocities.com/yort1223/MCRV2/HideShow.js">
</script>
<a title="Show Tables" href="javascript:toggleDisplay('table1')"><b><center>[Show/Hide MC Radio]</center></b>
<div style="display:none;" id=table1>
<div class="tableborder"> <div class='maintitle' align='left'>MC Radio V2</a></div> <table border="0" cellspacing="1" cellpadding="4"> <tr> <th align="center" width="23%" class='titlemedium'>Station</th> <th align="center" width="32%" class='titlemedium'>Description</th> <th align="center" width="20%" class='titlemedium'><center>Genre</center></th> </tr> <tr> <td class="row4" align="center">
<b>Listen to </b><form name="form1">
<select name="station" size="1" onChange="displaydesc(document.form1.station, description, genre, 'textcontainer1')">
<option selected value="http://www.1club.fm/clubfm_media/v42.aspx?station=activex" target="newwin">Active Radio X</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=modernrock" target="newwin">Modern Rock</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=classicrock" target="newwin">102 Rock</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=hairband">Hair Band Rock</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=classicalt-dude" target="newwin">Alternative Rock</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=clubuk" target="newwin">House of Trance</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=techno" target="newwin">Techno Club</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=harddance" target="newwin"> Gruvsonic Hard Dance</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=trance" target="newwin">Trance</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=rnb" target="newwin">R&B Hits</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=power" target="newwin">Old School Rap</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=breakbeat" target="newwin">70's Pop Hits</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=goapsy" target="newwin">80's Pop Hits</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=ibiza" target="newwin">90's Pop Hits</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=hitmusic" target="newwin">Channel 1</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=vradio" target="newwin">Variety Hits</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=vybe" target="newwin">70's Decade Hits</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=clubuk" target="newwin">80's Decade Hits</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=harddance" target="newwin">90's Decade Hits</option>
<option value="http://www.1club.fm/clubfm_media/v42.aspx?station=hkcountry" target="newwin">Kicker Country</option>
</select>
<input type="button" value="Listen"
onClick="jumptolink(document.form1.station)">
</form>
</a></td> <td class="row4">
<span id="textcontainer1" align="left" style="font:italic 13px Arial">
</span>
<script type="text/javascript" src="http://www.geocities.com/yort1223/MCRV2/description.js"></script>
<br /></td> <td class="row2" align="center">
<span id="textcontainer2" align="center" style="font:bold 13px Arial">
</span>
<script type="text/javascript" src="http://www.geocities.com/yort1223/MCRV2/genre.js"></script>
<script type="text/javascript" src="http://www.geocities.com/yort1223/MCRV2/main.js"></script>
</td></table>
<table border="0" cellspacing="1" cellpadding="4"> <tr> <th align="left" width="10%" height="5%" class='darkrow2'><a href="http://z11.invisionfree.com/MooseCreations" target="_blank">©</a> - Created By Agent Moose</th></tr></table>
</div><br></div>
</div><br></div>
<!--End MC Radio V2-->

---

What do you mean by "shorten HTML"?

Make it so that it is like this...

Code:

---

<script src="WWW.URLHERE.COM"></script>

---

Inside the URL will be something like this...

Quote:

---

document.write(<table>HTML HERE</table>

---

That is the easyest way I can put it.

The code above will be in URL part. Just like shortening JS. But with HTML...

Probably a better way to do this, but In the new js file type in this:

Code:

---

document.write('<html><title>This is a test</title></head><body></body></html>');

---

Then in the actual HTML document, type in:

Code:

---

<script type="text/javascript" src="newfile.js"></script>

---

Not tested, probably won't work, and don't even know if this is what you want to do. But Hope this helps.

Will work roughly, but is not a good idea, since it introduces a dependency on Javascript, slows down the page loading time, and eliminates progressive rendering. Don't do it.

If you need to generate something like that, do it serverside. By no means use client-side scripting.

What do you mean by Sever Side?

Server side would be by using PHP, ASP or some other type of programming language on your server.

oh. Well I don't know PHP or ASP. So...I can't do it...

Also.. if you have the js file on your server it's still there somehow, no matter which way you put it. Just because it's in an external file doesn't mean the overall filesize will be smaller.
Some people can disable JavaScript if they want to with their browsers, and that's what makes it unreliable.

Well, you could DOM it and put it in an external file.

//Also what mburt said ^^

I don't have a website. Just a forum from Invisionfree. I just learned something new...

Quote:

---

<script>
test = "<table border='1'>"
test += "</table>"
</script>

---

It creates a new table if I do sometihng like this...

Quote:

---

<script>
document.write("'+test+'")
</script>

---

but it doesnt' work...

Code:

---

document.write(test);

---

As tech said, using the dom way is better. Look at an article about what it is/how to use it here:
http://www.javascriptkit.com/domref/

Take that HTML, ant put it in an external HTML file, then use the following in forum:

Code:

---

<iframe src="html.html" frameborder="0">

---

Quote:

---

Originally Posted by techno_race

Take that HTML, ant put it in an external HTML file, then use the following in forum:

Code:

---

<iframe src="html.html" frameborder="0">

---

---

If I do that then it will be a diffrent CSS for the people who want to use my code...

I have just made a test table thing with the code I did above and it worked. So I tried adding some stuff with it, and it didn't work...does anyone know why?

Code:

---

<script>
mcsv1 = "<table width='100&#37;' id='userlinks' cellspacing='6'>"
mcsv1 += "<tr>"
mcsv1 += "<td class=guest><strong>MC Shop V1:</strong>  Please Log In to use the Shop.</td>"
mcsv1 += "<td class=member><strong>MC Shop V1:</strong>  Which Item would you like?</td>"
mcsv1 += "<form
action='http://s11.invisionfree.com/MCtest/index.php?'
method='post' name='REPLIER2'  class=member>"
mcsv1 += "<input type='hidden' name='act' value='Msg'></input>"
mcsv1 += "<input type='hidden' name='CODE' value='04'></input>"
mcsv1 += "<input type='hidden' name='MODE' value='01'></input>"
mcsv1 += "<input type='hidden' name='OID' value=''></input>"
mcsv1 += "<input type='hidden' name='reply_to' value=''></input>"
mcsv1 += "<input type='hidden' value='1' name='from_contact' class='forminput'></input>"
mcsv1 += "<input type='hidden' value='' name='Post' class='textinput'></input>"
mcsv1 += "<input type='hidden' value='Shop Item(s)' name='msg_title' class='forminput'></input>"
mcsv1 += "<td>"
mcsv1 += "<select name='dropdownselection'  class=member>"
mcsv1 += "<option value='Bold in Name----$300'>Bold in Name----$300</option>"
mcsv1 += "<option value='Italic in Name----$400'>Italic in Name----$400</option>"
mcsv1 += "<option value='Underline in Name----$500'>Underline in Name----$500</option>"
mcsv1 += "<option value='Username Change----$600'>Username Change----$600</option>"
mcsv1 += "</select>"
mcsv1 += "<td>"
mcsv1 += "<input type='submit' class=member value='Buy Item' tabindex='4'
accesskey='s' class='forminput' name='submit' />"
mcsv1 += "<td>"
mcsv1 += "<a href='http://z11.invisionfree.com/MooseCreations' target='_blank' alt='Created by Agent Moose at Moose Creations'>&#169;</a>"
mcsv1 += "</td>"
mcsv1 += "<script type='text/javascript' src='http://209.85.48.12/9607/144/upload/p3540207.ibf'></script>"
mcsv1 += "</td>"
mcsv1 += "</td>"
mcsv1 += "</tr>"
mcsv1 += "</table>"
mcsv1 += "</form>"
</script>

---

Code:

---

<script>
document.write("<center>" + mcsv1 + "</center>");
</script>

---

When ever I try it gives me this:

Quote:

---

" mcsv1 += "" mcsv1 += "" mcsv1 += "" mcsv1 += "" mcsv1 += ""

---

Some one help please

OR (insert dramatic music), use PHP (include):

Code:

---

<?php
$pages = array("page1.htm","http://www.google.ca/","page5.htm","yourpage.htm");
for ($i=0;$i<count($pages);$i++) {
    include $pages[$i];
    }
?>

---

↑ Please do this.

Client-side scripting *should not* be used for this kind of thing.