1、大连交通大学 2013 届本科生毕业设计（论文）外文翻译 1 外文原文 Source: Web Page Design Using JavaScript THE BASICS JAVASCRIPT uses a subset of the programming language JAVA to provide a high level of interactivity on a web page. JavaScripts are stored within an HTML document and are interpreted by the web browser. JavaScripts
2、 may be located within the HTML code at the point in the page where they are to appear on the screen or they may be written using functions. Functions are small subprograms that are stored between the head tags of an HTML document and are called on to be executed when a particular event occurs. Whet
3、her the script is stored between the head tags or within the body of the HTML document, it must be enclosed in script tags. Also, a set of HTML comment tags are typically used inside the script tags so that older browsers that do not support JavaScript will ignore the script and continue to process
4、the page without errors. Following is an example of the script and comment tags: Be aware that JavaScript is case sensitive.the difference between a working script and an error message can be one capital letter. ALERT BOXES To pop up an alert box include the following line of code inside of script t
5、ags in the body of your HTML document. Please note that the processing of the page will stop until the viewer responds to the alert box. alert (Place the text to be displayed in the alert box between these quotes.) Other types of pre-made dialog boxes are available such as the prompt and confirm box
6、es. In order to take full advantage of the features of these dialog boxes you must write more JavaScript code which can use the values that are returned by the dialog boxes. The following statements will pop up a dialog box that requires a yes or no answer (OK or Cancel). If the answer is OK then th
7、e variable named answer has a value of true and if the answer is Cancel then the variable named answer has a value of false. You can then use an if statement in the JavaScript code to respond appropriately. 大连交通大学 2013 届本科生毕业设计（论文）外文翻译 2 var answer = confirm (Are you sure you want to quit?) if (answ
8、er=true) window.close() The following code will pop up a dialog box that asks the user to enter some sort of information. If the user clicks OK the information they entered is stored in the variable. The second set of quotation marks inside of the prompt statement make the contents of the text box b
9、lank when the dialog box is displayed. var response = prompt (What is your name? ,) document.write (Hello + response + !) Notice that in the last two examples the window and document objects were used. Window refers to the browser window and document refers to the page being displayed. The use of a
10、dot after the name of the object allows actions to be performed on that object or properties of that object to be modified. In this next example, the navigator object is referenced in order to display the browser name and version. alert (You are using + navigator.appName + version + navigator.appVer
11、sion + .) POP-UP WINDOWS An additional browser window may be opened using a simple JavaScript. The open method contains three parts as in the following example: the name of the document or url of the web site to be displayed in the new window, the name that may be used to refer to the browser window
12、 (requires more code than is shown here), and the properties of the new window. Please note that the properties are all listed in one set of quotation marks and are separated by commas. open (myfile.html, mywin, height=200, width=200, titlebar=false) The following properties may be used to control t
13、he appearance of the new window: Table1-1 properties may be used to control the appearance of the new window Feature Example Description height height = 200 determines the height of the new window in pixels width width=200 determines the width of the new window in pixels titlebar titlebar=false remo
14、ves the title bar from the new window 大连交通大学 2013 届本科生毕业设计（论文）外文翻译 3 location location includes the url / address text box in the new window menubar menubar includes a menu bar in the new window resize resize=off makes the new window a fixed size scrollbars scrollbars adds scrollbars to the new wind
15、ow status status includes a status bar for the new window toolbar toolbar=yes adds a toolbar for the new window WRITING FUNCTIONS Functions are small subprograms that are located within script tags between the head tags of an HTML document. Functions are executed when they are called by name from an
16、 event handler within the body of an HTML document. The basic structure of a function is as follows: function NameOfFunction( ) Include JavaScript Code Here EVENT HANDLERS The following example demonstrates the use of event handler onclick as well as the use of styles to control the appearance of bu
17、ttons. Note that instead of using type=submit for the button the code simply says type=button. Copy and paste this entire set of code in to a new document and test it out. Sample #bigbutton background-color : yellow； font-family : arial； color : blue； font-size :18px； height : 50px； border-width : 0.2cm； border-color : red
