Jump to content

Single vs Double Quotes (Very Confusing!)


locbtran
 Share

Recommended Posts

The row in the table would highlight whenever I mouse over it. This works perfectly in HTML but I would like to convert from HTML code to Javascritp code to make it more dynamic.

<html><body> <TABLE border=1><TR bgcolor="#FFFFFF" onMouseOver="this.bgColor='gold';" onMouseOut="this.bgColor='#FFFFFF';">   <TD>Mauritania</td><TD>21N</TD><TD>24N</TD><TD> </TD><TD> </TD></TR><TR bgcolor="#FFFFFF" onMouseOver="this.bgColor='gold';" onMouseOut="this.bgColor='#FFFFFF';">   <TD>Myanmar</td><TD> </TD><TD>M TBA</TD><TD>M TBA</TD><TD> </TD></TR><TR bgcolor="#FFFFFF" onMouseOver="this.bgColor='gold';" onMouseOut="this.bgColor='#FFFFFF';">   <TD>Nepal</td><TD> </TD><TD> </TD><TD> </TD><TD>M TBA</TD></TR></TABLE> </body></html>

I tried to convert it to Javascript but it only gives me a blank screen.This is very frustrating because I don't know where I'm going wrong.Any comments of suggestions would be greatly appreciated.

<html><head><script type="text/javascript"> function init(){   document.writeln('<TABLE border=1>');    document.writeln('<TR bgcolor="#FFFFFF" onMouseOver="this.bgColor='gold';" onMouseOut="this.bgColor='#FFFFFF';">');   document.writeln('<TD>Mauritania</td><TD>21N</TD><TD>24N</TD><TD> </TD><TD> </TD> </TR>');    document.writeln('<TR bgcolor="#FFFFFF" onMouseOver="this.bgColor='gold';" onMouseOut="this.bgColor='#FFFFFF';">');   document.writeln('<TD>Myanmar</td><TD> </TD><TD>M TBA</TD><TD>M TBA</TD><TD> </TD></TR>');    document.writeln('<TR bgcolor="#FFFFFF" onMouseOver="this.bgColor='gold';" onMouseOut="this.bgColor='#FFFFFF';">');   document.writeln('<TD>Nepal</td><TD> </TD><TD> </TD><TD> </TD><TD>M TBA</TD></TR></TABLE>')';}</script></head> <body onload="init()"></body></html>

  • Like 1
Link to comment
Share on other sites

Try escaping the single quotes like the following and give the document a doctype:

<!doctype html><html><head><script type="text/javascript">function init(){    document.writeln('<TABLE border=1>');     document.writeln('<TR bgcolor="#FFFFFF" onMouseOver="this.bgColor=\'gold\';" onMouseOut="this.bgColor=\'#FFFFFF\';">');    document.writeln('<TD>Mauritania</td><TD>21N</TD><TD>24N</TD><TD> </TD><TD> </TD> </TR>');     document.writeln('<TR bgcolor="#FFFFFF" onMouseOver="this.bgColor=\'gold\';" onMouseOut="this.bgColor=\'#FFFFFF\';">');    document.writeln('<TD>Myanmar</td><TD> </TD><TD>M TBA</TD><TD>M TBA</TD><TD> </TD></TR>');     document.writeln('<TR bgcolor="#FFFFFF" onMouseOver="this.bgColor=\'gold\';" onMouseOut="this.bgColor=\'#FFFFFF\';">');    document.writeln('<TD>Nepal</td><TD> </TD><TD> </TD><TD> </TD><TD>M TBA</TD></TR></TABLE>');}</script></head><body onload="init()"></body></html>

Link to comment
Share on other sites

Why do you want to make Javascript write the table? Using Javascript to print HTML is not any more dynamic than having the HTML there already, and users who have Javascript disabled won't see the page. When using document.write() or document.writeln() the current page is cleared and the new content substitutes it, which is why it's a bad idea to use those functions.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...