WEB开发基础概念
1、WWW有哪些特点,它的基本工作原理是什么?
答:WWW的特点:(1).WWW是一个超文本链接信息系统(2).WWW是图形用户界面(3).WWW 与系统平台无关(4). WWW是分布式的(5). WWW是动态的(6). WWW采用交互浏览方式
WWW的工作原理:WWW使用HTML和HTTP,提供面向INTERNET服务器的、用户界面一致的信息浏览系统。WWW通常采用浏览器/服务器(B/S,BROWSER/SERVER)模式。信息资源以网页形式存储在WWW服务器中,用户在自己的计算机上通过客户端浏览某WWW服务器上的网页WWW工作步骤如下:
用户启动客户端浏览器,输入URL,浏览器软件通过HTTP向URL所在的WEB服务器发出服务请求。
服务器根据浏览器请求,把URL地址转化成页面所在服务器上的文件路径,找到相应的网页文件。
当网页中仅包含HTML标记时,服务器直接使用HTTP将该文档发送到客户端;如果HTML文档中还包含有JAVASCRIPT/VBSCRIPT等脚本程序代码,这些代码也将随同HTML文档一起下载,由浏览器执行脚本代码;如网页中嵌套有CGI或ASP程序,这些程序将由服务器执行,并将运行结果以HTML标记形式发给客户端。
浏览器解释HTML文档,并将结果在客户端浏览器上向用户显示
2、简要说明B/S系统的工作原理,试说明B/S对于传统C/S系统的优势。
答:
C/S架构和B/S架构最大的区别在于逻辑处理在哪端
纯C/S架构的大部分逻辑处理在客户端,所以服务器的负担很轻,可要修改逻辑处理的时候,就要把所有的客户端都改;纯B/S架构的大部分逻辑处理在服务端,所以服务器负担很重,可要修改逻辑处理的时候,只需修改服务端,不需修改客户端。
3、简要说明IP地址与域名的关系,域名解析服务器的作用是什么?
答:IP地址与域名的关系:一个IP地址对应多个域名。
域名解析服务器的作用是:域名服务器是装有域名系统的主机。它是一种能够实现名字解析的分层结构数据库。域名系统负责把域名翻译成IP地址。
4、目前进行网站开发有哪些主流平台和开发工具?
答:主流WEB开发技术与平台:ASP(动态服务器页面)与https://www.doczj.com/doc/fb3094340.html,、JSP、PHP(超文本预处理语言)。
5、WWW是World Wide Web (环球信息网)的缩写,也可以简称为Web,中文名字为“万维网”,用于检索和浏览链接到Internet服务器上的有关内容。它利用超文本(Hypertext)、超媒体(Hypermidia)等技术,使用户通过浏览器(如IE,FireFox)可以方便地检索远程服务器上的文本、图形、声音以及视频文件。
7、常用web术语
互联网:泛指由多个计算机网络相互连接而成的一个网络,它是在功能和逻辑上组成的一个大型网络,由美国阿帕网ARPANET发展而成,主要采用TCP/IP协议。
超文本(hypertext):一种全局性的信息结构,它将文档中的不同部分通过关键字建立链接,使信息得以用交互方式搜索。它是超级文本的简称。
超媒体是超文本(hypertext)和多媒体在信息浏览环境下的结合。它是超级媒体的简称。
域名:是internet上某一台或一组计算机的名称,用于在数据传输时标示计算机的电子方位。
域名服务器:是装有域名系统的主机。
电子邮件:用户或用户组之间通过计算机网络首发信息的服务。
浏览器:向万维网服务器发送各种请求,并对从服务器发来的由html语言定义的超文本信息和各种多媒体数据格式进行解释、显示和播放。
传输控制协议:是tcp/ip网络体系结构传输层的一个协议,用以提供可靠的数据传输。
文件传输协议:ftp是因特网上使用最广泛的文件传输协议,主要作用就是让用户连接上一个远程计算机,可以查看远程计算机上的文件,也可以复制远程计算机上的文件到本地计算机。
超文本传输协议:用于互联网上的浏览器和web服务器之间传输超文本的协议。
IP地址:也称作点数码组,是包含有四个由点号隔开的特定数字,每组数值由8个二进制位组成。
子网掩码:又称子网屏蔽。使用子网掩码可把一个网络分成若干个子网,每个子网使用不同的网络ID,主机IP分成两个部分,一部分用于标示作为唯一网络的子网,另一部分用于标示主机。
网关:又称协议转换器,连接两个或多个管理上相异的网络、子网的节点,是一种存储转发设备。
Applet(小程序):它与JAVA不同之处在于,他们不能访问本地计算机上的某些特定资源,也不能通过网络与其他大部分计算机通信。
ASP:采用面向对象的编程方法,无须编译和即可执行,还可以通过Active X控件扩充ASP 的功能。支持客户端和服务器端脚本,一般使用VBScript作为默认的脚本语言。
Cookie:是指www服务器发送给浏览器的一小段信息。
Session(会话):是服务器进程中存储一个客户端连接的信息,一个session对象的创建,是从一个客户连接开始。
URL:统一资源定位器,也称网页地址,是因特网上标准的资源的地址。
8、网页与网站
网页:当浏览者输入一个网站的网址或者单击某个链接,在浏览器里看到的文字、图片,可能还有动画、音频、视频等内容,承载这些内容的就是网页。
网站:就是各种各样内容网页的集合,有的网站内容庞杂,如新浪,网易这样的门户网站;有的网站可能只有几个页面,如小型的公司网站,但是它们都是由最基本的网页组合起来的。
首页:在网站中,有一个特殊的页面,它是浏览者输入某网站的去世后后看到的第一个页面,因此这个页面有一个专用的名称-Homepage,即首页,正因为主页浏览一个网站的起始页面,有的时候,“主页”也就成了“网站”的代名词,如“个人主页”。
9、网页基本元素
文本:包括字体、字型、颜色、段落设置以及对齐方式等。
图片:GIF、JPEG、PNG,矢量格式
超级链接:包括文字链接和图片链接,只要浏览者单击带链接的图片或文字,就可以自动链接上对应的其它文件。
动画:包括GIF动画和Flash动画。
网页特效:网页中使用JavaScript、VBScript等脚本语言实现的各种特殊动态效果,如跟随鼠标移动的文字或图像、下拉菜单、自动弹出窗口等,网页特效倒网页活泼、表现力更强。
表单:是一种可以在浏览者与服务器之间进行信息“交流”的东西,使用表单可以完成搜索、论坛、发送电子邮件、在线购物等交互功能。
音/视频:随着网络技术的发展,网页上面不再是单调的MIDI背景音乐,丰富多彩的网络电视、博客等已经开始成为网络新潮流。
10、网站常用功能
信息发布:企业/事业单位网站/
信息服务:信息查询服务:https://www.doczj.com/doc/fb3094340.html,、https://www.doczj.com/doc/fb3094340.html,
业务运营:学校信息系统:学籍管理/成绩查询/校园卡服务
电子商务:电信话费查询/网上购物平台(e-buy)
11、网站开发一般流程
(1)、前期规划:明确网站的目标和用户需求
(2)、网站素材的组织与准备:1)详细调查,广泛与有关人员接触,使其尽可能充分地提供一些详尽的资料与素材,尽可能多获取第一手的感性材料;2)多方听取意见;3)资料整理。
(3)、站点结构规划:1)站点逻辑结构:页面导航结构设计;2)站点目录结构设计。
(4)、界面设计、数据库设计、业务设计
(5)、页面制作、编程开发
(6)、站点测试、发布推广
12、目前主流web服务器
Microsoft IIS
Microsoft的Web服务器产品为Internet Information Server (IIS), IIS 是允许在公共Intranet或Internet上发布信息的Web服务器。IIS是目前最流行的Web服务器产品之一,很多著名的网站都是建立在IIS的平台上。IIS提供了一个图形界面的管理工具,称为 Internet 服务管理器,可用于监视配置和控制Internet服务。
IIS是一种Web服务组件,其中包括Web服务器、FTP服务器、NNTP服务器和SMTP服务器,分别用于网页浏览、文件传输、新闻服务和邮件发送等方面,它使得在网络(包括互联网和局域网)上发布信息成了一件很容易的事。它提供ISAPI(Intranet Server API)作为扩展Web服务器功能的编程接口;同时,它还提供一个Internet数据库连接器,可以实现对数据库的查询和更新。
Apache
Apache源于NCSAhttpd服务器,经过多次修改,成为世界上最流行的Web服务器软件之一。Apache 是自由软件,所以不断有人来为它开发新的功能、新的特性、修改原来的缺陷。Apache的特点是简单、速度快、性能稳定,并可做代理服务器来使用。本来它只用于小型或试验Internet网络,后来逐步扩充到各种Unix系统中,尤其对Linux的支持相当完美。
Tomcat
Tomcat是一个开放源代码、运行servlet和JSP Web应用软件的基于Java的Web应用软件容器。Tomcat Server是根据servlet和JSP规范进行执行的,因此我们就可以说Tomcat Server 也实行了Apache-Jakarta规范且比绝大多数商业应用软件服务器要好。
HTML语言基础
1、HTML语法规则:
(1)HTML标签由成对的尖括号“<>”、标签名及属性组成。
(2)标签可以嵌套使用,但不能交错嵌套
(3)HTML不严格区分大小写,但W3W(World Wide Web Consortium,万维网联盟)的Web标准中大小写意义不同,建议小写。
2、常用HTML标签:
标题(Headings)标签有6个级别,从
分段标记
…
align=”center”(居中)换行标记
文字样式控制
标签
Size:设置
size:设置字体大小,默认值3,可以取1到7,取值越大,文字显示越大相对值,+1表示比默认值大1号字体,反之亦然。
color:设置文字颜色,默认值为黑色,其值可取颜色名称或十六进制
face:设置字体样式。可指定一个或几个字体名称(用逗号格开),中文默认字体为“宋体”、英文默认为“Times New Roman”。
文字显示效果…
字体样式
常用逻辑字符样式:
指定网页设计者或维护者的信息,通常显示为斜体表示文本属于引用,通常显示为
表示程序代码,通常显示为固体宽度字体
表示定义了的术语,通常显示为黑体或斜体
强调某些词,通常显示为斜体
表示用户的键盘输入,通常显示为固定计划调节字体
表示文本样本,通常显示为固定宽度字体
特别强调某些字词,通常显示为粗体
表示变量,通常显示为斜体
常用物理字符样式:
粗体
斜体
下划线
大字体
小字体
删除线
删除线
下标
上标
固定宽度字体
图片标签
图像(Images)是由标签定义的,通常用来定义一个图片,scr属性用来指定图件路径。如果图片路径不对或者不支持图像的浏览器(如手机),图片就不能正常显示,通常给标签加上alt属性,当不能正确显示图片的时候,alt的值就能作为文字显示出来。标签还有width、height、align、border等属性分别表示宽度、高度、对齐方式、边线宽度等。
超链接
超链接是实现不同页面之间或者不同Web站点之间信息浏览的主要手段。
基本语法:超链接显示的文字 表格:table
表格具有以下属性:
border 表格边线
width/height 表格宽度/高度,可以设置为相对值或绝对值
align 水平对齐方式,可以设置center、left、right几种值
cellpadding 变单元格内容和单元格边界之间的距离
cellspacing 单元格之间的距离
valign 垂直对齐方式,baseline、bottom、middle、top
网页布局关系到网页的视觉效果与用户的审美感受,一个好的网页布局往往是网站成功的起点。
网页布局的方法很多,不用设计人员有不同的偏好,通常使用表格、DIV+CSS或者框架进行网页的布局。
表单
单行文本:
多行文本:
密码文本:
单选按钮:男女
复选按钮:读书运动
下拉列表:
按钮: 提交:
重置:
1、网页表单元素:文本框,单选按钮,复选按钮,下拉列表,按钮等。
2、HTML文档基本结构
整个HTML文档是一个层层嵌套的树形结构,最外层标签,整个文档由头部和正文组成,HTML文档的扩展名为.html或.htm。
头部:由标签
组成,标签内还可以嵌套其他头部标签。正文:由标签
组成,标签中又可以嵌套其他页面标签。3、超链接常用属性
Target(链接对象打开的窗口位置,_blank:新窗口打开,_parent:父窗口打开,_self:本窗口打开
Title:当鼠标悬停的在超链接上时,显示超链接的文字注释,可以使用“ ;”作为换行符
Href:超链接资源路径
name:使用name属性,可以跳转到一个文件的指定部位。
CSS样式表
1.与直接设置HTML属性控制样式相比,使用CSS有哪些优势?
答:(1)CSS使样式代码独立于网页HTML代码,简化网页格式设计,增强了网页的可维护性。
(2)样式与内容分离,可使用程序控制样式,增强了网页的表现能力。
(3)CSS文件可被浏览器缓存、加载和刷新网页时,只需要传送页面内容,就可以节省带宽,提高访问速度。
(4)内容与样式设计分离,有利于开发团队分工合作,提高代码重用性,提高开发效率。
(5)网页内容与外观代码分离,提高了页面的兼容性,不同的浏览器与设备可根据实际情况对同一站点的页面样式进行选择和处理。
2.CSS有哪些选择器,试通过实例说明它们的优先级和相互作用原理。
答:HTML标签作样式选择器、类作样式选择器、ID作样式选择器、层次样式选择器、超链接专用选择器、通配选择器
优先级从高到低依次:ID、类、HTML标签
使用类选择器和ID选择器区别:
(1)类选择器可以重复使用,且可以用在任意元素上,使用任意次;
(2)页面中HTML标签的ID属性应该是唯一的,拥有ID的元素才会应用该样式;
(3)ID选择器的优先权高于类选择器
3.试说明CSS盒模型。
答:盒模型是WEB页面一个非常重要的概念,网页文档流中的所有元素都可以看成是一个盒子,每个盒子在页面中占据一定的空间。
可以通过一幅画来理解盒模型,对于挂在墙上的一幅画来说,有画框,画与画框之间有距离,画框与画框之间也会有一定距离,即外边距,在网页盒模型中,外边距(margin)、边框(border)、内边框(padding)以及盒子的长(width)与高(height)共同组成了盒子模型。
4.欲制作一个网页相册,试用CSS说明带边框、多行多列图片列表的实现方式。
答:
5.掌握CSS的语法规则及各种属性的定义方法:
答:CSS由样式规则组成,以告诉浏览器怎样去显示一个文档。样式规则一般由样式符与属性组成。常用的样式符有HTML标签、用户自定义类和用户自定义ID等。
CSS样式语法规则:
样式符{attributes1:values1;attributes2:values2;…}
其中“样式符”表示要定义样式的类型,样式符可以包括HTML标签符、用户自主义类class 或用户自定义ID。“属性(attributes)”表示由CSS标准定义的样式属性,“属性值(values)”为样式属性的值。
样式规则:
样式选择器{
属性1:属性值;
属性2:属性值;
。。。
属性N:属性值;
}
关于样式表的语法,要注意以下几个问题:(1)属性必须包含在{}号之中;(2)属性和属性值之间用“:”分隔;(3)当有多个属性时,用“;”进行区分;(4)如果一个属性有几个值,则每个属性值之间用空格分隔开;(5)CSS语言对于属性值要求很严格,如果CSS规范中没有或者不符合要求,CSS语句都不能正常作用。
6.了解在网页中使用CSS的常用方法;
答:第一种是把CSS文档放到
文档中,第二种方法是把CSS样式表写在HTML的行内第三种方法是:把您编辑好的CSS文档保存成“.CSS”文件,然后在中定义。7.理解样式选择符及其作用原理
答:
8.CSS全称是Cascading Style Sheet,中文称为层叠样式表,它是一种标记性语言,配合HTML语言进行页面外观控制。CSS技术诞生于1996年。CSS是由W3C组织负责制定和颁布的,1996年12月发布的
9.类作为样式符
定义格式:
样式符.类名{ attributes1:values1;attributes2:values2;…},例:
span.blue{color:#0000FF}
span.red{color:red}
应用样式时在对应的HTML标签中加入class属性,属性值为样式表的类名。例:
这是一个引用两个不同span样式的例子,蓝色span与红色span
类的声名也可以不针对具体的HTML标记符,这样定义的类可以被应用于任何HTML标签,通常称为在。
格式:
。类名{ attributes1:values1;attributes2:values2;…}
引用时在标签属性内加上class属性,属性值为类名。
10.样式符为HTML标记
利用用户自定义类可以实现所有的HTML标签的样式选择,当要达到复杂的样式效果时,可以采用样式分类的方法实现。
11.用户自定义ID作为样式符
用户自主义ID与用户自定义类的功能相同,其区别仅为定义语法与引用方法不同。
定义格式如下:#ID名{ attributes1:values1;attributes2:values2;…}
12.超链接专用选择器
a:link(没有接触过的链接),用于定义了链接的常规状态。
a:hover(鼠标放在链接上的状态),用于产生视觉效果。
a:visited(访问过的链接),用于阅读文章,能清楚的判断已经访问过的链接。
a:active(在链接上按下鼠标时的状态),用于表现鼠标按下时的链接状态。
13. CSS样式表的引用方式有内部嵌套和引用外部样式表文件几种基本方式。
html标签中以style属性引用样式
示例:
这是一个直接书写样式的段落
头部标签嵌套引用
网页
之间插入样式表代码:引用外部样式表文件
之间通过link引用外部文件:14. CSS属性具有继承、层叠等特性。
CSS继承原则决定HTML子标签会继承父标签的样式风格,并可以在父标签的基础上加以修改,产生新的样式,而子标签的样式风格不会影响父标签的样式。利用这一原则,可以将公共的样式写在父标签的样式中,从而节省CSS代码编写量。
就近原则:当多个样式都对某个标签起作用时,如果多个样式中的属性互不冲突,则这些样式共同作用于标签,也称层叠性。如果定义的样式属性有冲突,在优先级相同的前提下,这些样式中发生冲突的属性就按就近原则对标签作用。
15.CSS属性:
(1)长度单位,有相对单位与绝对单位。
相对长度:px,em,%
绝对长度:in,cm,mm,pt,pc
(2)颜色值
(3)字体属性
Font-family属性:用来设置HTML元素的字体列表,可设置多个值,浏览器由前向后依次选择字体
Font-size属性:用来控制字体显示的大小,取值有相对取值有相对取值和绝对取值,相对取值可使用%或相对值larger、x-large、small、smaller等,绝对取值是指使用绝对长度单位,如:px、pt等
Font-style属性:用来设置指定元素的显示字形样式,font-style属性有normal(普通)、italic(斜体)、oblique(倾斜)三种取值,默认值为normal
Font-weight属性:设置字体的粗细,属性取值可为normal bold bolder light lighter 100 200 … 900 , 100至900依次最细渐变到最粗
Font-variant属性:设置字体异体,具有normal与small-caps两种取值
注意:small-caps只是将小写字母显示成大写格式,但不是字母转换,本质上仍是小写字母。
Font属性:设置字体属性的一种简略写法,设置时可以省略某些属性,应按font-weight font-variant font-style font-size font-family的顺序依次出现(4)文本属性:
Letter-spacing属性:设置字符间距,属性值可为具体长度,并可取负值,用来紧缩字符间距。
Word-spacing属性:设置文本中单词(汉字)间的距离
Line-height属性:控制标记符中文本行高。其取值可以是数字、度或百分比,normal 为默认值。
Text-decoration属性:文本修饰属性,包括none 、underline(下划线)、overline(上划线)、line-through(删除线)、以及闪烁(blink)等值,none为默认值,IE中不支持blink效果,在Firefox浏览器中可以看到闪烁效果。
Text-align/vertical-align属性:设置文本的水平对齐/垂直对齐,text-align取值为left 、right、center、justify,默认值为left,vertical-align的取值为baseline 、sub 、super 、top 、text-top、 middle 、bottom 、text-bottom等值,baseline为默认值。
Text-transform属性:用来设置文本格式转换,取值有none(默认值)、capitalize(首字母大写)、uppercase(字母大写)、lowercase(字母小写)。
Text-index属性:设置首行缩进,取值可以为数值或百分比,可取正值或负值,默认值为0,表示无缩进。
(5)颜色和背景
1、颜色属性
2、背景属性:网页中可以设置背景颜色background-color和背景图案background-image属性。
Background-image可以为HTML标签指定背景图片,url用来设置背景图片路径,一般来说,网页背景不需要和页面等大,通过background-repeat实现图片在页面中的平铺,从而节省带宽,background-repeat有repeat(水平与垂直平铺)repeat-x(水平方向平铺)repeat-y(垂直方向平铺)no-repeat(不平铺)等取值方式,repeat为默认值。
Background-image属性控制指定的背景图案是否跟随内容一起滚动,取值为scroll(拉动滚动条时,背景图片随内容一齐滚动)、fixed
(6)定位属性:用于控制元素在页面上的位置,实现页面内元素之间的重叠
Position属性:设置元素在页面的定位方式,值可以是static(按html格式规则正常定位)、relative(定位在于页面前一个元素的末端位置)、absolute(定位在框架或浏览器窗口本身左上角的绝对位置),默认值为static。
top和left属性:规定某个元素与其他元素之间的距离,按像素来设定元素位置往下或往
右的距离。
例:p { position: absolute; top: 20px }(段落的顶部边缘设置到距离窗口顶部边缘的下方20像素)
z-index属性,解决元素的重叠问题,相当于某些编辑软件中“层”的概念。取值为大于等于-1的自然数,当图片作为背景时,可使用值-1
overflow属性,溢出,设置当元素内容溢出其区域时如何对内容进行管理,取值可为visible、hidden 、scroll 、auto。
(7)浮动属性与文档流
Float属性:将元素的内容浮动到页面的左边缘或右边缘,取值为left 、right、none,默认值为none。
Clear属性:指定一个元素是否允许有元素漂浮在它的旁边,取值为none、 left、 right、both,默认值none
(8)Cursor鼠标属性
url:需要被使用自定义光标的URL,一般图片格式为jpg
default:默认光标(通常是一个箭头)
auto:默认。浏览器设置一种光标
crosshair:光标呈现为十字线
pointer:光标呈现为指示某个链接的指针
move:此光标可指示某对象可被移动
e-resize:此光标可指示某个矩形框的边缘可被向右(东)移动。
(9)边框属性
边界属性(margin):margin-left、margin-right、margin-top、margin-bottom分别设置页面元素左、右、上、下边界的宽度,取值可以为长度、百分比或auto。使用margin可以同时设置四个方向的边界宽度。
边框属性:边框宽度:border-left-width、border -right-width、border -top-width、border -bottom-width分别用来设置左、右、上、下4个边框的宽度,取值可以是thin、medium、thick、length、medium。 border-width可以同时设置四个方向的边框宽度。
边框颜色:border-left-color、border -right-color、border -top-color、border -bottom-color分别用来设置左、右、上、下4个边框的颜色。border-color可以同时设置四个方向的边框颜色
JavaScript基础
1.JavaScript是由Netscape公司开发并随Navigator
2.0一起发布的一种基于对象(Object)和事件驱动(Event Driven)的客户端脚本语言。(客户端语言,解释型语言, 面向对象, 事件驱动)
2.JavaScript功能:控制网页的外观与内容;与网页表单进行交互;与用户进行交互;对浏览器进行控制;AJAX功能。
3. JavaScript特点:简单性;动态性;跨平台性。
4. JavaScript与Java语言有什么区别和联系?
答:1)Java是由SunW公司推出,主要用于网络程序设计,对于非程序设计人员来说不易掌握;而JavaScript主要用于编写网页中的脚本,易于学习和掌握。
2)Javat程序可以单独执行,但JavaScript程序只能嵌入HTML中,不能单独运行。
3)Java具有严格的类型限制,JavaScript则比较宽轻。
4)Java程序编译执行需要专门的虚拟机才能实现,JavaScript程序在一般浏览器中即可运行。
5.简述DOM模型,JavaScript如何根据DOC模型操纵网页元素?
答:文档对象模型DOC全称是Document Object Model,DOM定义了操作文档对象的接口,
主要用来处理HTML文档的DOM结构。
DOM模型可以理解成一个树形结构,例如HTML文档中,html是根结点document的子对象,而head和body又是html的子对象,两者又有各自的子对象。
可以使用以下方式实现对一个结点的引用:
1)使用docment.getElementById() 引用指定的ID的结点
2)使用getElementByName()获取具有相同name属性的元素集合
3)使用getElementByTagName()获取具有相同标签名的元素集合
6.在网页中使用JavaScript的方法:
1)在HTML标记中直接写入JavaScript代码
2)将JavaScript代码嵌入标记中
3)调用外部JS文件:将在网页中可能会被重复使用的JavavScript代码独立存一个扩展名为.js的文件,在当前网页中利用
7.对象(Ojbect)是面向对象程序设计的核心。要理解面向对象编程,必须理解类和对象两个概念。
类:简单地说就是模板,是一类具有某种性质的物体的集合
对象:就是类的具体实现。
对一个对象一般包括以下两种基本操作:即属性和方法。
对象的属性和方法使用一般格式:对象名.属性对象名.方法
9.事件与事件驱动
事件驱动是网页设计者实现网页动态效果的切入点,事件驱动包括事件和事件处理程序两个基本概念。
事件(EVENT)是指用户在某个对象上所作的动作。
事件处理程序,是指当某个事件发生时,通过程序作出的相应响应。
onabort 图像加载被中断
onblur元素失去焦点
onchange用户改变域的内容
onclick鼠标点击某个对象
ondblclick鼠标双击某个对象
onerror当加载文档或图像时发生某个错误
onfocus元素获得焦点
onkeydown某个键盘的键被按下
onkeypress某个键盘的键被按下或按住
onkeyup某个键盘的键被松开
onload某个页面或图像被完成加载
onmousedown某个鼠标按键被按下
onmousemove鼠标被移动
onmouseout鼠标从某元素移开
onmouseover鼠标被移到某元素之上
onmouseup某个鼠标按键被松开
onreset重置按钮被点击
onresize窗口或框架被调整尺寸
onselect文本被选定
onsubmit提交按钮被点击
onunload用户退出页面
10.浏览器对象
moveBy()可相对窗口的当前坐标把它移动指定的像素
moveTo()把窗口的左上角移动到一个指定的坐标。
open()打开一个新的浏览器窗口或查找一个已命名的窗口
print()打印当前窗口的内容
prompt()显示可提示用户输入的对话框。
resizeBy()按照指定的像素调整窗口的大小
resizeTo()把窗口的大小调整到指定的宽度和高度。
scrollBy()按照指定的像素值来滚动内容
scrollTo()把内容滚动到指定的坐标
setInterval()按照指定的周期(毫秒计)来调用函数或计算表达式
setTimeout()在指定的毫秒数后调用函数或计算表达式
XML基础
1.XML是Extensible Markup Language的缩写,意为可扩展的标记语言。与HTML结构相似,但XML是一种专门表示数据的标记语言。XML是Internet环境中跨平台的、依赖于内容的技术,是当前处理结构化文档信息的有力工具。
2.XML的特点
●XML使用有意义的标记(TAG),具有语义。
●XML是描述数据内容的语言,本身并不决定数据该如何显示,数据的显示由
XSL决定。
●XML可自定义标记,可由用户按需要增加标记。
●XML对语法有严格的要求,所有XML的文件都必须经过严格的“验证”过程
才算完成,文件格式容易转换。
3.XML的优势
(1)、数据的检索(2)、数据的显示(3)、数据的交换
4.XML相关技术
DTD(Documentation Type Definition,文档类型定义)
XSD(XML Schema Definition,XML模式定义)
CSS(Cascading Style Sheets,级联样式表)
XSL(Extensible Stylesheet Language,可扩展样式语言)
XLL(Extensible Linking Language,可扩展链接语言)
5.XML语法:XML语言对格式有着严格的要求,主要包括格式良好和有效性两种要求。
6.XML文档的组成:
1)XML的声明
Version表示XML的版本号;standalone表示文档是否附带DTD文件,默认为no;
encoding表示文档的编码方式,默认是“UTF-8”
2)处理指令PI
3)DTD样式
4)注释
5)元素、属性、文本
6)CDATA
7)实体
7.内部的DOCTYPE(文档)声明
语法:<!DOCTYPE根元素[元素声明]>
8.外部的DOCTYPE(文档)声明
语法:<!DOCTYPE 根元素SYSTEM“文件名”>
9.在DTD中,元素的声明语法为:
<!ELEMENT DESCRIPTION(#PCDATA,DEFINITION)*>
10.在DTD中,属性的声明语法为:
<!ATTLIST元素名称属性名称属性类型默认值>
11.XML文档实质上是一个个实体组合,或者说,实体(entities)在XML文档中是一种数据单位。实体只有在DTD文件中声明后,才可以在其他地方被用。
12.XML实体从不同角度有不同的表达,如通用实体和参数实体,内部实体和外部实体。
内部实体与XML文档存储在一起,而外部实体则存放在其他文件内,通过URL来存取。
声明内部实体语法:<!ENTITY entity_name entity_value>
13、声明外部实体语法:<!ENTITY entity_name SYSTEM url_uri>
其中:entity_name:实体名称;entity_value:实体所代表的数据内容;url_uri:实体参考文件的地址路径。
14、所谓内部实体指的是实体引用值属于一个字符串的文本字符内容。
15、XSL文档显示的方法有:CSS样式、XSL
16、在XML文档中,CSS的使用方式用两种:引用式和内嵌式。
1)引用式是指XML文档本身不含有样式信息,而通过引用外部独立的CSS文件来定
义文档的表现形式。
2)内嵌式是指将CSS样式指令直接嵌入到XML文档内部,为元素设置style属性,
并在属性值中给出对其样式的定义。
其语法格式:
xml-stylesheet type ="text/css" href="css_uri"? >
type属性:指出所使用的样式表种类
href属性:指定外部CSS文件路径
17、XSL是XML专属的样式语言。它从功能上分为两部分:一是转换XML文档,二是格式化XML文档。
18、XSL样式表的基本结构是一个树状结构,该结构的根元素名称为stylesheet。
其语法格式:
version="1.0" xmlns:xls="https://www.doczj.com/doc/fb3094340.html,/1999/XSL/Transform"> xsl:stylesheet> version属性:表示XSLT的版本号,用于指出该XSLT文档遵从哪个标准 xmlns属性:作用是声明XSLT所使用的命名空间 19、一个XSL文档主要由一条模板规则构成,一条模板规则有一个模式,该模式指定了它能够作用的树状结构,当模式匹配时就会按照模板样式输出。 XSL中每一条模板规则就是一个xsl:template元素,该元素的内容定义了将源文档转换到结果所需要的规则。在这个元素中,有一个match属性,它的作用就是指出一种模式,用以标示出可以应用该规则的节点。 实验: 个人简历
盒子模型(相册)
.modle{width:15%;height:25%; border: thin; margin:15px 15px 15px 15px;padding:20px 20px 20px 20px;}
img{float:left}
调用样式表
.css文件
body {text-align: left;background:url(images/bg.gif ) top center repeat;}
#left{float: left;margin: 0 0 0 6px;}
#foot{clear: both;margin-left: 12px;width: 95%;}
#main {float: right;border: 1;}
a:link { color: #339933; text-decoration: none}
a:visited { color:#gray; text-decoration:line-through}
a:active { color: #ff0000; text-decoration: underline}
a:hover { color: #ff0000; text-decoration: underline}
调用.css时在head中的格式:
实验六
1、在页面上生成一个如下图所示的菜单,当鼠标移动菜单上时,切换成红色背景的图片,当鼠标移开时恢复原样,图片位于images文件夹下
function dispsub()
{
a=dispsub.arguments;
b=a[0];
c=a[1]
for (i=1; i<=c; i++)
{
submenu = eval("sub" + i);
if( i==b )
{submenu.background="images/1.gif"
}
else
{submenu.background="images/2.gif"
}
}
}
2、当鼠标单击菜单时,弹出对话框:你点击了工具栏菜单一,你工具栏菜单二……