网络应用基础.pptVIP

2005-02-25第6讲网络应用基础第6讲网络应用基础指挥自动化学院沙俊星回顾HTTP协议的通信过程网页上显示的多彩多姿的页面，其本质是什么？教学目的和重点教学目的掌握ASP.NET编程必要的背景知识对浏览器端的编程有一个较全面的了解了解静态网页的运行、开发机制重点HTML标记语言CSS层叠样式表JavaScript语言要点HTMLCSSJavaScriptHTTP协议的工作原理HTTP协议的工作原理服务器端简单地针对请求应答浏览器端向服务器提交请求解析HTML渲染HTML什么是HTML超文本标记语言（HyperTextMarkupLanguage）除了能够标记文本外，还能够标记图像等众多元素演示-HelloWorld！代码htmlheadtitleHelloWorld!/title/headbodyh1HelloWorld!/h1pThisismyfirstpage./p/body/htmlHTML元素标签属性=值内容/标签元素之间的嵌套形成树型结构HTML元素的嵌套HelloWorld分析常用元素–标题和段落h1这是一个标题/h1h2这是一个标题/h2h3这是一个标题/h3h4这是一个标题/h4h5这是一个标题/h5h6这是一个标题/h6p这是一段。/pp这又是一段，br但有一个换行。/p常用元素–超链超链ahref=/微软/a鼠标点击触发浏览器的请求动作图像imgsrc=“logo.jpg常用元素–表格常用元素–表单（form）包含类似于Windows控件的各种元素（按钮、文本框、单选框、复选框…）按钮可以触发浏览器的提交请求、执行JavaScript函数等动作在VS.NET中创建静态页面如果记不住标签，可以从工具箱中拖放控件，十分方便制作一个“计算器”演示在VS.NET中画出界面问题界面风格太凌乱单独调整很麻烦有没有好的方法？要点HTMLCSSJavaScriptCSS技术层叠样式表（CascadingStyleSheet）可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制CSS的作用通用性可以轻松地控制页面的布局更新方便CSS的好处CSS语法选择器{属性:值}例如：body{color:black}p{text-align:center;color:black;font-family:arial;}选择器组把需要设置相同样式的选择器组合书写减少样式重复定义例如：p,table{font-size:9pt}效果完全等效于：p{font-size:9pt}table{font-size:9pt}问题相同的标签名需要设置不同的样式，怎么办？（例如input标签）类选择器把相同的元素分类定义不同的样式定义：p.red{color:Red}p.blue{color:Blue}使用pclass=redRED/ppclass=blueBLUE/pCSS属性和HTML属性的关系在当前的网页设计上，虽然基本语法还是HTML，但样式的设定则更倾向于使用CSS来取代HTML的标签属性演示用CSS美化计算器界面问题如何让“计算器”能够计算？要点HTMLCSSJavaScriptJavaScript语言实现了实时的、动态的、可交互式的表达能力特点是一种脚本编程语言基于对象的语言简单性安全性动态性跨平台性组成“语言”的两大要素语法、库语法–使JavaScript能够“转起来”库–使JavaScript能够操纵页面上的元素基本数据类型“弱类型”vara=10;varb=2.5;varc=“Hello”;控制语句与C语言一样包含：if条件语句for循环语句while循环break和continue语句…函数定义function函数名(参数表){函数体;return表达式;}可以自定义函数也有现成的系统函数对象“基于对象”可以自定义对象也可以使用内部对象文档对象模型（DOM）1998年，W3C发布了第一级的DOM规范，允许访问和操作HTML页面中的每一个单独的元素，所有的浏览器都支持了这个标准，可用JavaScript操作DOMCoreDOM-针对任何结构化文档的对象XMLDOM-针对XML