《网页制作教程 教学课件 ppt 作者 赵丰年 1_英文ppt chap9-javascript and DHTML》由会员分享,可在线阅读,更多相关《网页制作教程 教学课件 ppt 作者 赵丰年 1_英文ppt chap9-javascript and DHTML(33页珍藏版)》请在金锄头文库上搜索。
1、1/33,Chapter 9 JavaScript and DHTML,2/33,Objectives,Explain the 3 layers of a Web document. Insert JavaScript code on a Web page. Explain basic JavaScript syntax. Explain objects and JavaScript objects. Explain DOM. Use common objects such as document, window, form. Describe the event handling mecha
2、nism. Explain DHTML. Apply simple DHTML on your pages.,3/33,Why JavaScript?,A Web page that is semantically marked up and beautifully designed is wonderful, but to really make it an experience, it needs some interactivity. The 3-layer: structural, presentation and behavioral.,4/33,What is JavaScript
3、?,JavaScript is a programming language mainly used on the Web. JavaScript is not Java. JavaScript can be used to test browsers, respond to user activities, validate form data, and display customized content (such as floating animation).,5/33,JavaScript Dos and Donts,Like many tools, JavaScript can b
4、e used for good or evil. The evil uses of JavaScript are all around: rapid-fire pop-ups that open faster than you can close them, sites that automatically set themselves as your home page, the list goes on and on. As Web professionals, we have a duty to make the user experience as positive as possib
5、le and make our sites both usable and accessible. JavaScript should be used in such as way that a page or site can be used without it.,6/33,Using JavaScript,JavaScript can be implemented on a single page or on an entire site. As with CSS, it can be embedded in a document, or externalized from that d
6、ocument. See page 161. embedded in the head element embedded in tags linked from an external file,7/33,Skills Needed in Programming,The first hard thing about programming is to learn, become comfortable with, and accept some artificial mechanisms, whether they make “sense” to you or not. Attention t
7、o detail Stupidity Good memory Ability to abstract, think on several levels,8/33,Attention to detail,In programming, the details matter. You cant be vague; you cant describe your program 3/4 of the way and then say “You know what I mean?” and have the compiler figure out the rest. You have to dot yo
8、ur is and cross your ts. If the language says you have to declare variables before using them, you have to.,9/33,Stupidity,Computers are incredibly stupid. They do exactly what you tell them to do: no more, no less. When youre programming, it helps to be able to “think” as stupidly as the computer d
9、oes, so that youre in the right frame of mind for specifying everything in minute detail, and not assuming that the right thing will happen unless you tell it to.,10/33,Good memory,Things to remember while programming: the syntax of the language the set of prewritten functions and their parameters w
10、hat variables and functions youve defined in your program and how youre using them techniques youve used or seen in the past bugs youve had in the past.,11/33,Ability to abstract,One of the most powerful techniques for managing the complexity of a software system (or any complex system) is to compar
11、tmentalize it into little black box processes which perform useful tasks but which hide some details so you dont have to think about them all the time. Think about the mechanics of a design hierarchy, while also use that hierarchy to avoid having to think about every detail of it at every level.,12/
12、33,JavaScript Syntax - Statements,Each script we write consists of a series of statements. Statements can be terminated with a line break or with a semicolon (;). first statement second statement first statement; second statement; For readability, and to avoid potential statement termination problem
13、s, it is recommended that you use both.,13/33,JavaScript Syntax - Comments,Sometimes it is helpful to make notes for yourself to keep track of what is going on in a script. There are two styles of comment in JavaScript: / this is a comment /* this is a multi-line or block comment */,14/33,JavaScript
14、 Syntax - Variables,Variables are the place you use to hold the pieces of data that a program is working on. Variables must be declared before you use them. var MYVAR; / uppercase var myvar; / lowercase var myVar; / camel case var MyVar; / initial caps var MyVaR; / mixed case JavaScript is case-sens
15、itive.,15/33,JavaScript Syntax Data Types,JavaScript variables can be one of several different data types. Those data types fall into 2 different categories: scalars and arrays. Scalar variables have one value at a time. That value can be a string, a number, or a Boolean. Arrays can contain multiple
16、 values.,16/33,JavaScript Syntax Data Types,Strings Strings are enclosed by either single () or double (“) quotes and can contain zero or more characters: var empty = ; var girl_cat =“Sabine”; var zip_code = 100081; Numbers var my_age = 18; Booleans Booleans are true/false values. They can be represented by the keywords true or false or the numbers 1 and 0, respectively: var bald = false; / I am not bald (yet) var bearded = 1; / I do have a beard,17/33,