JavaScript, Behind the Scenes

behind the scenes with javascript
In this section, we will introduce you to how JavaScript fits in with the HTML formatting for a web page. You should have a working knowledge of HTML and a comfort with editing HTML documents. We most strongly recommend that you use a basic text editor (SimpleText on the Macintosh or the Windows NotePad) as web page generastor programs generally make a huge mess of JavaScript.
JavaScript code can be entered as text anywhere in an HTML document. It is "marked" by the <script> tags:
  <script language="javascript">
  
      (a whole bunch of javascript code)
      
  </script>
The Javascript code itself consists of line-by-line logical programming instructions. When a web browser reads in HTML code it begins formatting the page as the code comesi n; when the browser reaches a <script> tag, it follows the instructions in the order that they appear.
A few conventions help browsers that do not recognize JavaScript (fewer and fewer these days). If a web browser does not know what to do with JavaScript, it ignores the <script> tag part and begins displaying all of the JavaScript programming lines as if it were web page content! Also, sometimes (do not ask us why) people de-activate JavaScript as a browser option.
The first part of prevention is inserting "comment" codes in the right places so that a JavaScript-impaired browser will not interpret the code inside as display content:
  <script language="javascript">
             
  </script>
The "". The "//" in the second to last line tells JavaScript not to execute that particular line. Therefore, a browser that does not supports JavaScript ignores the <script> and </script> tags, because it does not know what they mean, and it ignores everything in between because it is encased inside an HTML comment tag. Pretty clever, eh?
Now you may be curious about what the JavaScript code looks like or how it works. This is way behind the scope of what we can cover, and we will defer to resources provided in the next section. For the most part, the code looks like computer programming, as it logically tests values of variables, performs conditional branching, calculates new values, writes output, etc.
With JavaScript you can also add new commands to HTML form elements so you can bring them to life, as well as do things like make images change when the mouse floats over them. If you have not noticed so far, the navigation menu at the top of every page in this workshop uses a JavaScript menu (we will show you how to make these in our third example).
a place for javascript
You will find and/or place JavaScript code into distinct areas of your HTML file. Quite often, a large portion of the code (commands that are called from scripts in a later parts of the web page) are placed inside the <head> ... </head> tags, simply because they are not part of the displayed web page, just the "brains" working in the background:
  <html>
  <head>
  <title>My Interactive Page</title>
  
  <script language="javascript">
             
   </script>
   
   </head>
   <body>
      :
      :
Other times you will see JavaScript code placed within the display area of the web page; this is done when you use JavaScript to actually write part of the HTML depending on certain conditions or need it to perform a process related to a page element.
For example (and a poor one at that!), you may have a welcome line in large text at the to of your HTML page followed by a greeting. You could use JavaScript to first check the current time, and if it is before noon, you could have JavaScript write "Good Morning" with a graphic image of a sun, and if it was after 6:00 PM you might have it say, "Good Evening" with a picture of a moon.
This is but a simple way that JavaScript can be used to make dynamic web pages, ones that are not the same every time they are viewed.

what's next?
Now that we've reviewed where JavaScript sits inside a web page, we will look at sites where you can find JavaScript code that you can "cut and paste" into to your own web pages.