Twango Posted January 6, 2010 Share Posted January 6, 2010 Hey, i need help, i make a script-download website, and i am making a customizable clock, i have the internal html, and such, i want to use document.getElementById to change it, but first, the writing it to the webpage isnt working.here's the working code: <html><body onLoad="clock()"><script type="text/javascript">function clock(){d=new Date();seconds=d.getSeconds();hours=["NULL","1","2","3","4","5","6","7","8","9","10","11","12","1","2","3","4","5","6","7","8","9","10","11","12"];isap=["NULL","AM","AM","AM","AM","AM","AM","AM","AM","AM","AM","AM","NOON","PM","PM","PM","PM","PM","PM","PM","PM","PM","PM","PM","MIDNIGHT"];hours=hours[d.getHours()];minutes=d.getMinutes();if (seconds<10){seconds="0" + seconds;}else{seconds=d.getSeconds();}if (minutes<10){minutes="0" + minutes;}else{minutes=d.getMinutes();}document.getElementById('tmclock').innerHTML=hours + ":" + minutes + ":" + seconds + " " + isap[d.getHours()];var reset=setTimeout("clock()",1000);}</script><b><font color="Lawngreen" style="font-family:Arial Black"><p id="tmclock"></p></font></b></body></html> and here's how i'm writing it text id="nr"><!--Free From ScriptFreak.weebly.com--><br/><html><br/><body onLoad="clock()"><br/><script type="text/javascript"><br/>function clock()<br/>{<br/>d=new Date();<br/>seconds=d.getSeconds();<br/>hours=["NULL","1","2","3","4","5","6","7","8","9","10","11","12","1","2","3","4","5","6","7","8","9","10","11","12"];<br/>isap=["NULL","AM","AM","AM","AM","AM","AM","AM","AM","AM","AM","AM","NOON","PM","PM","PM","PM","PM","PM","PM","PM","PM","PM","PM","MIDNIGHT"];<br/>hours=hours[d.getHours()];<br/>minutes=d.getMinutes();<br/>if(seconds<10)<br/>{<br/>seconds="0" + seconds;<br/>}<br/>else<br/>{<br/>seconds=d.getSeconds();<br/>}<br/>if(minutes<10)<br/>{<br/>minutes="0" + minutes;<br/>}<br/>else<br/>{<br/>minutes=d.getMinutes();<br/>}<br/>document.getElementById('tmclock').innerHTML=hours + ":" + minutes + ":" + seconds + " " + isap[d.getHours()];<br/>var reset=setTimeout("clock()",1000);<br/></script><br/></text><text id="chng1"><b><font color="Lawngreen"</text><text id="chng2"> style="font-family:Arial Black"><p id="tmclock"></p></font></b><br/></body><br/></html> Yet when i copy and paste it. the HTML doesn't work, please help, thanks! Link to comment Share on other sites More sharing options...
justsomeguy Posted January 6, 2010 Share Posted January 6, 2010 text id="nr">What is that for? What are you trying to use a <text> element for anyway? There's no such element. It's best to use something to encode all of the characters to their HTML entities, PHP has a function that will do that, and another that will add <br> tags to newlines. You missed a couple characters that should have been encoded but weren't. Link to comment Share on other sites More sharing options...
ShadowMage Posted January 6, 2010 Share Posted January 6, 2010 and here's how i'm writing ittext id="nr"><!--Free From ScriptFreak.weebly.com--><br/><html><br/><body onLoad="clock()"><br/><script type="text/javascript"><br/>function clock()<br/>{<br/>d=new Date();<br/>seconds=d.getSeconds();<br/>hours=["NULL","1","2","3","4","5","6","7","8","9","10","11","12","1","2","3","4","5","6","7","8","9","10","11","12"];<br/>isap=["NULL","AM","AM","AM","AM","AM","AM","AM","AM","AM","AM","AM","NOON","PM","PM","PM","PM","PM","PM","PM","PM","PM","PM","PM","MIDNIGHT"];<br/>hours=hours[d.getHours()];<br/>minutes=d.getMinutes();<br/>if(seconds<10)<br/>{<br/>seconds="0" + seconds;<br/>}<br/>else<br/>{<br/>seconds=d.getSeconds();<br/>}<br/>if(minutes<10)<br/>{<br/>minutes="0" + minutes;<br/>}<br/>else<br/>{<br/>minutes=d.getMinutes();<br/>}<br/>document.getElementById('tmclock').innerHTML=hours + ":" + minutes + ":" + seconds + " " + isap[d.getHours()];<br/>var reset=setTimeout("clock()",1000);<br/></script><br/></text><text id="chng1"><b><font color="Lawngreen"</text><text id="chng2"> style="font-family:Arial Black"><p id="tmclock"></p></font></b><br/></body><br/></html> Yet when i copy and paste it. the HTML doesn't work, please help, thanks! Hopefully this isn't what your code looks like in the source file. All the < and > entities should be < and > otherwise you are only printing those characters to the screen, not creating HTML tags.Also, could you be more specific by 'doesn't work.' Link to comment Share on other sites More sharing options...
Twango Posted January 6, 2010 Author Share Posted January 6, 2010 <font id="nr"><!--Free From ScriptFreak.weebly.com--><br/><html><br/><body onLoad="clock()"><br/><script type="text/javascript"><br/>function clock()<br/>{<br/>d=new Date();<br/>seconds=d.getSeconds();<br/>hours=["NULL","1","2","3","4","5","6","7","8","9","10","11","12","1","2","3","4","5","6","7","8","9","10","11","12"];<br/>isap=["NULL","AM","AM","AM","AM","AM","AM","AM","AM","AM","AM","AM","NOON","PM","PM","PM","PM","PM","PM","PM","PM","PM","PM","PM","MIDNIGHT"];<br/>hours=hours[d.getHours()];<br/>minutes=d.getMinutes();<br/>if(seconds<10)<br/>{<br/>seconds="0" + seconds;<br/>}<br/>else<br/>{<br/>seconds=d.getSeconds();<br/>}<br/>if(minutes<10)<br/>{<br/>minutes="0" + minutes;<br/>}<br/>else<br/>{<br/>minutes=d.getMinutes();<br/>}<br/>document.getElementById('tmclock').innerHTML=hours + ":" + minutes + ":" + seconds + " " + isap[d.getHours()];<br/>var reset=setTimeout("clock()",1000);<br/></script><br/></font><font id="chng1"><b><font color="Lawngreen"</font><font id="chng2"> style="font-family:Arial Black"><p id="tmclock"></p></font></b><br/></body><br/></html></font> OK that's correct, i would have that on my page. then with a <select> users can update the color and font, (document.get...) then they would copy/paste to the page that they want it ati copy and paste the result and it is just blank! Link to comment Share on other sites More sharing options...
ShadowMage Posted January 6, 2010 Share Posted January 6, 2010 OK that's correct, i would have that on my page. then with a <select> users can update the color and font, (document.get...) then they would copy/paste to the page that they want it ati copy and paste the result and it is just blank!Ok, yea sorry, that one went over my head. Bit of a moment there! Anyways, you missed a closing bracket on your function. That should fix it I think. Link to comment Share on other sites More sharing options...
justsomeguy Posted January 6, 2010 Share Posted January 6, 2010 OK that's correctNo it's not, you still missed at least one character. Start with your original code, and find and replace "<" characters (you don't need to replace ">"), then add your additional code in.It's not blank either, when I copy and paste that into a new document it's definitely not blank. Link to comment Share on other sites More sharing options...
Twango Posted January 7, 2010 Author Share Posted January 7, 2010 Thanks JKLOTH. i fixed it if you want to see. here it is: <script type="text/javascript">function crp(color){var ind=color;document.getElementById('chng1').innerHTML=ind;doprecolor(color);}function frp(font){inc=font;document.getElementById('chng2').innerHTML=inc;doprefont(font)}function doprefont(font){document.getElementById('Pr').style.fontFamily=font;}function doprecolor(color){document.getElementById('Pr').style.color=color;}</script><br/><b>Change Color:</b><select onchange="crp(value)"><option value="Lawn Green" selected>Select</option><option value="Red">Red</option><option value="Darkred">Dark Red</option><option value="Orange">Orange</option><option value="Darkorange">Dark Orange</option><option value="Yellow">Yellow</option><option value="#FFCC00">Dark Yellow</option><option value="Green">Green</option><option value="Darkgreen">Dark Green</option><option value="#99FF00">Neon Green</option><option value="Lawngreen">Lawn Green</option><option value="Blue">Blue</option><option value="Darkblue">Dark Blue</option><option value="Indigo">Indigo</option><option value="Violet">Violet</option><option value="Purple">Purple</option><option value="#660066">Dark Purple</option></select><br/><b>Change Font:</b><select onchange="frp(value)"><option value="Arial Black" selected>Select</option><option value="Arial">Arial</option><option value="Arial Black">Arial Black</option><option value="Arial Narrow">Arial Narrow</option><option value="BatangChe">BatangChe</option><option value="Belwe Cn BT">Belwe Cn BT</option><option value="Blackadder ITC">Blackadder ITC</option><option value="BRAZIL">BRAZIL</option><option value="CENA">CENA</option><option value="Century Gothic">Century Gothic</option><option value="Courier New">Courier New</option><option value="Times New Roman">TNR</option></select><br/><font color="Lawngreen" style="font-family:arial black"><b id="Pr"> Preview: 12:09:59 PM</b></font><br/><b>Copy And Paste This Code into an HTML Section to use:</b><br/><text id="nr"><!--Free From ScriptFreak.weebly.com--><br/><html><br/><body onLoad="clock()"><br/><script type="text/javascript"><br/>function clock()<br/>{<br/>d=new Date();<br/>seconds=d.getSeconds();<br/>hours=["NULL","1","2","3","4","5","6","7","8","9","10","11","12","1","2","3","4","5","6","7","8","9","10","11","12"];<br/>isap=["NULL","AM","AM","AM","AM","AM","AM","AM","AM","AM","AM","AM","NOON","PM","PM","PM","PM","PM","PM","PM","PM","PM","PM","PM","MIDNIGHT"];<br/>hours=hours[d.getHours()];<br/>minutes=d.getMinutes();<br/>if(seconds<10)<br/>{<br/>seconds="0" + seconds;<br/>}<br/>else<br/>{<br/>seconds=d.getSeconds();<br/>}<br/>if(minutes<10)<br/>{<br/>minutes="0" + minutes;<br/>}<br/>else<br/>{<br/>minutes=d.getMinutes();<br/>}<br/>document.getElementById('tmclock').innerHTML=hours + ":" + minutes + ":" + seconds + " " + isap[d.getHours()];<br/>var reset=setTimeout("clock()",1000);<br/>}<br/></script><br/></text><b><b><font color="<b id="chng1">Lawngreen</b>"</b><b> style="font-family:<b id="chng2">Arial Black</b>"><p id="tmclock"></p></font></b><br/></body><br/></html></b> On the page you can chose from a wide array of Fonts and Colors.then copy and paste the code to your page and a realtime clock will come up in 9:09:05 A/PM/MN/NOON formatTook about 5hrs to make tops. enjoy Link to comment Share on other sites More sharing options...
justsomeguy Posted January 7, 2010 Share Posted January 7, 2010 FYI, these were the characters I was talking about:if (seconds<10)...if (minutes<10) Link to comment Share on other sites More sharing options...
Twango Posted January 7, 2010 Author Share Posted January 7, 2010 Umm Huh? Link to comment Share on other sites More sharing options...
ShadowMage Posted January 7, 2010 Share Posted January 7, 2010 FYI, these were the characters I was talking about:if (seconds<10)...if (minutes<10)The < symbol in these lines of your code should be converted to html entities <BTW, justsomeguy, for this to validate wouldn't you also need to encode the > symbols too? Link to comment Share on other sites More sharing options...
justsomeguy Posted January 7, 2010 Share Posted January 7, 2010 The > character only has meaning when it's closing a tag (or when the browser thinks it is), if it's not in a position where it would close a tag then the browser wouldn't have a problem with it.I didn't look at the spec or the validator, that's just what I'm assuming. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.