View Full Version : Need Help Styling Common Content Made with JavaScript

07-18-2010, 05:14 PM
Hi, I'm not good with manipulating JavaScript for my needs and I am trying to use a JavaScript file to implement my common content in to my web page, in this case it is a news article I want to display across all of my web pages. The problem is that I want to style it and use html attributes in side of the document.write and that is apparently messing it up. Would someone be able to show me how to fix this problem or fix the code so I can get the common content to display correctly with styling from CSS. If possible I would like to keep the CSS in a separate file and put a link to it in the JavaScript file and use the class tags, but I do not know how far we can go with JavaScript.
Thanks for helping. Here are links to the webpage where I would like the code to show up. Below is the JavaScript that is currently in my .js file.

http://www.nasawear.com/Home.html (The news article should display in the right column.)

document.write("<link rel="stylesheet" type="text/css" href="css/mainpage.css" />");
document.write("<h3 class="section">");
document.write("New NASA News");
<div class="picbox">
<a target="_blank" href="image/superhotplanet-full.jpg">
<img class="white" width="335" height="268" src="image/superhotplanet-full.jpg" alt="NASA Finds Super-Hot Planet with Unique Comet-Like Tail" /> Full Size</a>
<p class="imageandstuff">NASA Finds Super-Hot Planet with Unique Comet-Like Tail</p>
<p class="dis">
Astronomers using NASA's Hubble Space Telescope have confirmed the existence of a baked object that could be called a "cometary planet." The gas giant planet, named HD 209458b, is orbiting so close to its star that its heated atmosphere is escaping into space.
Observations taken with Hubble's Cosmic Origins Spectrograph (COS) suggest powerful stellar winds are sweeping the cast-off atmospheric material behind the scorched planet and shaping it into a comet-like tail.
Illustration Credit: NASA, ESA, and G. Bacon (STScI)
</div> ");

07-18-2010, 05:49 PM
Your javascript isn't working because it isn't formatted correctly - your quotation marks aren't consistent. For example, in:

document.write("<h3 class="section">");

js sees the quotes in class="section as the end of the text to write, then finds more text after it and fails. This example should be:

document.write('<h3 class="section">');


document.write("<h3 class='section'>");

Having said all that, it sounds like you are just trying to include a single bit of code on multiple pages, in which case a php include might be a better bet - and doesn't rely on your users having javascript enabled. Have a look here (http://www.tizag.com/phpT/include.php) for some info.