专题四-网站设计与研发教程.ppt

网站设计和开发;*;*;静态网页-HTML;静态网页-HTML;静态网页-HTML;静态网页-HTML;静态网页-HTML;静态网页-HTML;*;静态页面工作原理 ;*;这一时期的Web设计更像是平面设计，而不是程序设计。这样设计出来的页面，只能呈现静态的文本和图像，无法提供满足用户需求的交互模式，也无法展示动态的信息。;*;动态网页又分：客户端动态网页和服务器端动态网页 客户端动态：由浏览器上的模块（插件）完成创建动态网页的全部工作。 服务器端动态：由Web服务器处理请求后生成对应的网页发送回浏览器 ;动态页面工作原理 ;动态网页和静态网页的区别：;*;JavaScript简介;什么是JavaScript ;将JavaScript嵌入网页 ; 在HTML标记中直接写入JavaScript代码 HTML BODY P onmouseover=alert(欢迎您学习JavaScript!)鼠标移过来/P /BODY /HTML 运行;将脚本程序代码作为属性值;使用 Script 标签;脚本代码的位置;使用外部 JS 文件 ;使用外部 JS 文件 ;JavaScript的基本语法;JavaScript中保留的关键字;基本数据类型与常量;声明变量;声明变量; eval(字符串)：将传入的字符串参数内容，转换成相应的数值，例如： y=eval(“15”)+8; 结果：y=23 parseInt(字符串，[底数])：将传入的字符串，转换成指定底数的数值。 parseFloat(字符串)：将传入的字符串，转换成浮点数值。 举例 ;运算符;算术运算符;程序的流程控制;函数;函数的作用;函数的定义与调用;;参数个数可变的函数;创建动态函数;JavaScript 函数;对象;对象与对象实例;JavaScript 对象简介;构造方法与this关键字;script language =“javascript” function Person(name, age) { this.age = age; = name; this.say = sayFunc; } function sayFunc() { alert(+” : ”+this.age); } var person1 = new Person(“张三”， 18); person1.say(); var person2 = new Person(“李四”，20); person2.say(); /script;JavaScript的内部对象;Object对象;String 对象;String 对象;String对象;Math对象;Math 对象;HTML HEAD META http-equiv=refresh content=2 TITLE自动刷新/TITLE SCRIPT language=JavaScript document.write(2秒自动刷新，随机显示图片); var i=0; i=Math.round(Math.random( )*8+1); document.write(IMG width=640 height=433 src=+ i +.jpg); /SCRIPT /HEAD BODY /BODY /HTML;Date 对象;Date 对象;Date 对象;Date 对象;Date 对象;Date 对象;HTML BODY script language=javaScript var now= new Date( ); var hour = now.getHours( ); if (hour=0 hour =12) document.write(上午好!) if (hour12 hour= 18) document.write(下午好!); if (hour18 hour 24) document.write(晚上好!); document.write(P今天日期:+now.getYear()+年“ +(now.getMonth( )+1)+月+now.getDate()+日); document.write(P现在时间:+now.getHours()+点+now.getMinutes( )+分); /script /body /HTML;Dat