Object-Oriented Planetary Data Presentation
/*
JavaScript Bible, Fourth Edition
by Danny Goodman
John Wiley & Sons CopyRight 2001
*/
<HTML>
<HEAD>
<TITLE>Our Solar System</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!-- start script
// method definition
function showPlanet() {
var result = "<HTML><BODY><CENTER><TABLE BORDER=2>"
result += "<CAPTION ALIGN=TOP>Planetary data for: <B>" + this.name + "</B></CAPTION>"
result += "<TR><TD ALIGN=RIGHT>Diameter:</TD><TD>" + this.diameter + "</TD></TR>"
result += "<TR><TD ALIGN=RIGHT>Distance from Sun:</TD><TD>" + this.distance + "</TD></TR>"
result += "<TR><TD ALIGN=RIGHT>One Orbit Around Sun:</TD><TD>" + this.year + "</TD></TR>"
result += "<TR><TD ALIGN=RIGHT>One Revolution (Earth Time):</TD><TD>" + this.day + "</TD></TR>"
result += "</TABLE></CENTER></BODY></HTML>"
// display results in a second frame of the window
document.write(result)
document.close()
}
// definition of planet object type;
// 'new' will create a new instance and stuff parameter data into object
function planet(name, diameter, distance, year, day) {
this.name = name
this.diameter = diameter
this.distance = distance
this.year = year
this.day = day
this.showPlanet = showPlanet // make showPlanet() function a planet method
}
// create new planet objects, and store in a series of variables
var Mercury = new planet("Mercury","3100 miles", "36 million miles", "88 days",
"59 days")
var Venus = new planet("Venus", "7700 miles", "67 million miles", "225 days", "244 days")
var Earth = new planet("Earth", "7920 miles", "93 million miles", "365.25 days","24 hours")
var Mars = new planet("Mars", "4200 miles", "141 million miles", "687 days",
"24 hours, 24 minutes")
var Jupiter = new planet("Jupiter","88,640 miles","483 million miles",
"11.9 years", "9 hours, 50 minutes")
var Saturn = new planet("Saturn", "74,500 miles","886 million miles",
"29.5 years", "10 hours, 39 minutes")
var Uranus = new planet("Uranus", "32,000 miles","1.782 billion miles",
"84 years", "23 hours")
var Neptune = new planet("Neptune","31,000 miles","2.793 billion miles",
"165 years", "15 hours, 48 minutes")
var Pluto = new planet("Pluto", "1500 miles", "3.67 billion miles", "248 years", "6 days, 7 hours")
// called from push button to invoke planet object method
function doDisplay(popup) {
i = popup.selectedIndex
eval(popup.options[i].text + ".showPlanet()")
}
// end script -->
</SCRIPT>
<BODY>
<H1>The Daily Planet</H1>
<HR>
<FORM>
<P>Select a planet to view its planetary data:
<SELECT NAME='planetsList' onChange='doDisplay(this)'>
<OPTION>Mercury
<OPTION>Venus
<OPTION SELECTED>Earth
<OPTION>Mars
<OPTION>Jupiter
<OPTION>Saturn
<OPTION>Uranus
<OPTION>Neptune
<OPTION>Pluto
</SELECT></P>
</FORM>
</BODY>
</HTML>
Related examples in the same category
