| Lesson 1: alert() Today we are going to discuss one of the most basic methods in javascript, the alert() method of the Window object, in order to explore how javascript interacts between the HTML used to incorporate JavaScript into a page, the Document Object Model (known as the DOM) which defines the document and all of it's contents, and the user who has called the page into a JavaScript capable browser. The greatest benefit we derive from various scripting languages is the ability to display a page that can respond to the user's actions and or other events in order to create an interactive experience. Pages no longer must be the same every time they are shown, and can in fact be made to be different for every single user who visits, and even different every time a particular user visits! Let's look at one way to give the user a message, and then break it down to understand the three way interaction: Sample 1 alert() (cc&p to a testbed to try): 1) HTML used to incorporate this code: A) note that the scripting is placed between tags, just like most any HTML tags. B) some browsers (not many) still don't support JavaScript, and so they don't recognize the script tags and ignore them. However, the scripting itself will then cause errors, so we use regular HTML comment tags [!-- and --] Replace brackets with arrows! (note-I used the JavaScript comment // command to hide my comments in the sample script). We do not have to use these comments for WebTv only pages. I will not use these in future samples, but you should if you have high computer traffic to your webpages! C) we follow standard practice here and place the script section in the head section of the HTML document, but this could be placed anywhere (you'll learn more about this) 2) DOM affected by the scripting used: A) the Window object is a window or frame that contains a document, or multimedia file, or database query file, or anything else that can be displayed in a browser. It is the "global object" that contains everything included in the document, and allows scripting to refer to the various objects that make up it's contents. B) alert() is the method of the Window object used to display a message to the user till the user clicks a button. Since Window is the top level of the DOM, the alert() method can be called without referencing the Window, so both window.alert('Message'); and alert('Message'); are valid statements. C) The message string contained as an argument in the alert() statement can be a string enclosed in quotations marks, a numerical value, or a variable containing any alpha-numeric value. 3) User Interactivity: A) the document in this sample contains no text to be displayed on the page, but the alert() alters the page by placing a text message in a recognizably visible display. B) the user must interact with the page in order to continue by either clicking the alert's button, or pressing their browser's back button, either way interaction is required to proceed. C) the user now has not only looked at your page, but now has done something (interacted) with your page, leaving more of an impression. Notes- 1) Use alerts sparingly, nothing is more aggravating than a bunch of alerts one after the other! 2) Use alerts to debug your scripts, by placing them at various poins with various data from the scripting to be debugged, you can determine at which point you may have made an error in your coding. 3) The message the alert can display is text only, no HTML. The only formatting possible is through the use of newlines (\n) and creative spacing. The longer the message, the smaller the text size used by the WebTv browser to display the message, and extremely long messages may be truncated at any point. Extra samples to try: |