web-9. 动态网页与数据库

9. 动态网页与数据库

9.1 动态网页的概念

从静态网页到动态网页的发展史网站建设的革命建设，它实现了用户客户端和网站服务器段交互方式的改变，实现了从但反馈到双向互动的转变，实现了从单一媒体到互动平台的转变，体现了当代网站建设的精髓。

  1. 什么是动态网页

动态网页就是能够实现用户和服务器动态交互，满足用户个性化网页请求的动态HTML（Dynamic HTML，DHTML）。

HTML是一种静态的网页设计语言，主要提供文本和图形的显示功能，但它却难以提供对媒体、二维空间移动、精确文字定位、图形大小和位置动态等动态页面编辑功能。而DHTML则不同。

DHTML需要一种方法来控制文档中所有需要控制的元素，这可以通过一些脚本语言来完成。例如：JavaScript或VBScript，脚本语言会把相关信息嵌入到页面上的每个元素，并检阅它们的设置值，设置发生预想的变化。

DHTML和动态数据库技术不同，它不是面向服务器的脚本，如JavaScript，DHTML的所有操作都可以在客户端自己完成，除了改变页面内容外，不需要改变服务器。页面下载后，无论什么时候，DHTML都可以处理页面元素，修改页面版面、内容和位置，并把结果不断提供给用户。

DHTML作为服务器自带的功能，实际上只是一种技术概念，并不属于一种专门的技术，而胡思多种技术综合的结果。

目前，实现DHTML的技术主要有：客户端的脚本程序语言、DOM（文档对象模型）、层叠样式表CSS等。

  1. 客户端脚本程序语言

HTML应用中的客户端脚本语言有JavaScript、Perl、JScript、VBScript等。在用户浏览网页的时候，当鼠标在一些图形和控件上移动时会产生一些奇妙的变化。这些变化就是通过客户端脚本语言来编写和实现的。

<html>

<head>

<title>使用一个JavaScript脚本语言写的一个动态网页</title>

</head>

<body>

<center>测试你在20s内能单击几个框？</center>

<script language="JavaScript">

var total=0;

var play=false;

function display(element)

{

var now=new Date();

if(!paly)

{

play=true;

startTime=now.getTime();

}

if(now.getTime() - startTime > 2000)

{

element.checked=!element.checked;

return;

}

if(element.checked)

total++;

else

total--;

element.form.num.value=5;

}

function restart(from)

{

total=0;

paly=false;

for(var i=1;i<=100;++i)

{

form.elements[i].checked=true;

}

}

document.write("<from><center>");

document.write(‘<input type="text" value="5"‘);

document.write(‘name="num" size=10 onFocus="this.blur()"><br>‘);

document.write("<hr size=1 width=40%>");

for(var i=0;i<10;++i)

{

for(var j=0;j<10;++j)

{

document.write(‘<input type="checkbox"‘);

document.write(‘onClick="display(this)">‘);

}

document.write("<br>");

}

document.write("<hr size=1 width=40%>");

document.write(‘<input type="button" value="restart"‘);

document.write(‘onClick="restart(this.form)">‘);

document.write("</center></form>");

</script>

</body>

</html>

  1. 文档对象模型（DOM）

在某种意义上说，DOM是DHTML真正意义上的核心内容，正是它使得HTML具备了活动性。DOM体现的是网页元素的等级关系，在浏览器上，这些元素在指定的时间呈现。DOM包括时空背景信息，如当前时期、时间；包括浏览器自身的属性，如浏览器的版本号；包括窗口自身属性，如网页的URL；最后还包括个HTML元素，如<p>标记、<div>或者表格。通过将DOM向DHTML语言公开，浏览器能够使网页更多的功能元素发挥作用。如果像日期、时间之类的元素不能自动变换，它也可以通过JavaScript修改其他元素来完成。

事件模块（Event Model）与事件

DOM中指定元素进行变换的那部分称为时间模块。所谓“事件”指的是对页面进行的动作，诸如鼠标在页面的某一个元素上的移动（onMouseOver）、打开网页（onLoad）、提交一个反馈表单（onSubmit）、单机反馈表输入区（onFocus）等。

例：

<html>

<head>

<title>编辑产品信息</title>

<script>

function popOnload()

{

if(opener)opener.blockEvents();

}

function popOnUnload()

{

if(opener)opener.unblockEvents();

}

</script>

</head>

<body onunload="popOnUnLoad();">

<table>

<tr>

<td>产品名</td>

<td><input type="text" value="电视机"></td>

</tr>

<tr>

<td>编号</td>

<td><input type="text" value="A001"></td>

</tr>

<tr>

<td> </td>

<td><input type="button" value="提交">

<input type="button" value="取消" onclick="window.close()">

</td>

</tr>

</table>

</body>

</html>

  1. 层叠样式表（CSS）

CSS属于DOM的一部分，它的属性可以通过DHTML编写的语言得到体现，因此几乎能够实现页面外在视觉效果的一切变化。通过改变页面元素的CSS属性（如颜色、位置、大小），可以达到机器的带宽和处理器的运行速度允许范围内的一些效果。

注：

CSS是使网页发生改变的对象，DOM是其具有变动性的机制，而客户端的脚本语言是世界促成变换的程序。三者结合应用，就构成了动态的HTML。

建立一个1.html文件，一个2.css文件

1.html

<html>

<head>

<link rel="stylesheet" href="2.css" type="text/css">

</head>

<body>

<center>

<h2>欢迎使用超级系统维护软件</h2>

<div class="table">

<table>

<tr>

<td>用户名</td>

<td><input type="text" name="username"></td>

</tr>

<tr>

<td>密码</td>

<td><input type="password" name="password"></td>

</tr>

<tr>

<td>自动登录</td>

<td><input type="checkbox" name="auto"></td>

</tr>

<tr>

<td> </td>

<td align="right"><input type="submit" value="进入" class="botton"></td>

</tr>

</table>

<div id="footer">版权所有：段立勇</div>

</div>

</center>

</body>

</html>

2.css

body,table

{

font:12px Tahoma;

margin:20px;

}

h2{

font:bolder 24px Tahoma;

color:darkred;

}

.table{

border:1px outset lightgrey;

padding:20px;

background:lightyellow;

width:300px;

}

.button{padding:2px 10px 2px 10px;

border:1 out1set white;

background:darkblue;

color:white;

font:bolder 11px Tahoma

}

#footer{

font:10px Tahoma;

margin:30px 10px 10px 10px;

text-align:right;

}

 

9.2 数据库的概念

数据库是计算机内的一个容器，用于存放使用表格组织起来的用户数据。对这些数据进行管理的计算机软件就称为数据库管理系统。在实际应用中，通常把数据库以及用户数据库管理的计算机软禁一起称为数据库应用系统。

Web数据库是基于Web的数据库应用系统。现在的Web应用程序中会大量地使用到数据库操作。常用的数据库软件有SQL Server 7.0。

9.3 数据库结构设计

数据库的作用：

数据库(Database)是按照数据结构来组织、存储和管理数据的仓库，它产生于距今六十多年前，随着信息技术和市场的发展，特别是二十世纪九十年代以后，数据管理不再仅仅是存储和管理数据，而转变成用户所需要的各种数据管理的方式。数据库有很多种类型，从最简单的存储有各种数据的表格到能够进行海量数据存储的大型数据库系统都在各个方面得到了广泛的应用。

在信息化社会，充分有效地管理和利用各类信息资源，是进行科学研究和决策管理的前提条件。数据库技术是管理信息系统、办公自动化系统、决策支持系统等各类信息系统的核心部分，是进行科学研究和决策管理的重要技术手段。

  1. SQL语言简介

结构化查询语言（Structured Query Language，SQL）是关系数据库管理系统（DataBase Management System，DBMS）中的标准语言，已经被众多的关系数据库管理系统所采用，如MSSQL Server、Access、Qracle等。

使用SQL语言，可以从数据库中获取数据，建立数据库和数据库对象，增加数据、修改数据和失信复杂的查询功能。它允许用户在高层的数据结构上工作，而不是对单个记录进行操作，可操作记录集。所有的SQL语句接受集合作为输入，返回集合作为输出。允许将一条语句的结果作为另一条语句的输入。

  1. 数据库结构设计

在SQL Server中，数据库把所有的数据与数据库对象都放在一系列操作文件中，并用文件和文件组管理这些操作系统文件。文件主要分为3中：主文件、从属文件和日志文件，每个文件只能属于一个数据库。

主文件：

它是一个数据库的起点，一个数据库文件只能有一个主文件且必须有一个主文件。

从属文件：

它的数目是任意的，一般一个小型数据库可以没有从属文件，而一个大的数据库可能存在多个从属文件。从属文件和主文件一同存储数据和数据库对象。

日志文件：

日志文件用来存放数据库的日志信息，这些信息对恢复数据库是十分关键的，一般一个数库必须至少有一个日志文件。

  1. sql server的作用

SQL Server 工具和实用程序
服务管理器（服务器有，客户端没有）
企业管理器
查询分析器
导入和导出数据
服务器网络实用工具
客户端网络实用工具
联机帮助文档
事件探测器
SQL Server 2000提供了大量的联机文档，它具有索引和全文搜索能力，可根据关键词来快速查找用户所需信息。
Have a try
Sqlserver数据库
系统数据库
SQL Server自己所使用的数据库，包括：master、msdb、model、pubs、Northwind、tempdb
其中 pubs 和 Northwind 示例数据库作为学习工具提供

安装步骤：https://blog.csdn.net/benben513624/article/details/50516276

9.4 常用的SQL语句

T-SQL为MS SQL Server的SQL语句，在SQL Server环境下，可以使用T-SQL语言并使用Query Analyzer管理并创建数据库。

  1. 创建数据库语句

CREATE DATABASE database_name

[ON [PRIMARY]

[<filespec> [,...n]]

[,<filegroup> [,...n]]

]

[LOG ON {<filespec> [,...n]} ]

[FOR LOAD | FOR ATTACH]

<filespec> ::=

( [ NAME = logical_file_name,]

FILENAME=’os_file_name’

[, SIZE=size]

[, MAXSIZE = {max_size|UNLIMITED}]

[, FILEGROWTH =growth_increment] ) [,...n]

<filegroup> ::=

FILEGROOWUP filegroup_name <filespec> [,...n]

其中

database_name：要创建的数据库的名称，在SQL Server中，数据库的名称必须是唯一的。

ON：指明存放数据库的磁盘文件，以及所属的文件组（可以忽略）。

PRIMARY：定义一个主文件或者从文件组，如果PRIMARY缺省，则CREATE DATABASE语句中的第一个数据文件为主文件。

n：一个文件组中的文件个数。

LOG ON：定义一个日志文件以及存放日志文件的磁盘文件。

FOR LOAD：为了与早期的SQL Server保持兼容。

NAME=logical_file_name：定义数据文件的逻辑文件名。

FILENAME=’os_file_name’：定义存放数据文件的OS文件名以及路径。

SIZE：定义数据文件的大小。

MAXSIZE：定义数据文件能增长到的最大值。

FILEGROWTH：定义数据文件的自动增长值。

此外，语句CREATE DATABASE需要在master数据中执行。

例子：

CREATE DATABASE MIS

ON PRIMARY

(

NAME = ‘MIS_Dat’,

FILENAME=’D: \MIS\MIS_Dat.mdf’,

SIZE = 5MB,

MAXSIZE = 10MB,

FILEGROWTH = 5MB

)

LOG ON

(

NAME=’MIS_Log’,

FILENAME=’D:\MIS\MIS_Log.ndf’,

SIZE=2MB,

MAXSIZE=5MB,

FILEGROWTH=20%

)

其他的语句不在赘述，详情请看：

https://blog.csdn.net/zdwzzu2006/article/details/2298777

原文地址：https://www.cnblogs.com/free-1122/p/9876941.html

时间： 2024-11-13 07:55:10

web-9. 动态网页与数据库的相关文章

怎么区分静态网页和动态网页

在建设网站时,会经常听到静态网页和动态网页,但是他们真正的区别是什么?接下来仔细分析下二者的区别.静态网页是网站建设的基础,静态网页和动态网页之间也并不矛盾,为了网站适应搜索引擎检索的需要,即使采用动态网站技术,也可以将网页内容转化为静态网页发布. 一.静态web页面,一般指html: 1.在静态Web程序中,客户端使用Web浏览器(IE.FireFox等)经过网络(Network)连接到服务器上,使用HTTP协议发起一个请求(Request),告诉服务器我现在需要得到哪个页面,所有的请求交给W

静态网页与动态网页的区别

1. 什么是静态网页?什么是动态网页?两者的区别是什么?试举例说明. 答:在网站设计中,纯粹 HTML 格式的网页通常被称为 " 静态网页 " ,早期的网站一般都是 由静态网页制作的.静态网页是相对于动态网页而言,是指没有后台数据库.不含程序和 不可交互的网页.你编的是什么它显示的就是什么.不会有任何改变.静态网页相对更新 起来比较麻烦,适用于一般更新较少的展示型网站.静态网页的网址形式通常为 : www.exa mple.com/eg/eg.htm ,也就是以 .htm . .htm

什么是静态网页与动态网页

什么是静态网页与动态网页? 在服务器端运行的程序.网页.组件,属于动态网页,它们会随不同客户.不同时间,返回不同的网页 运行于客户端的程序.网页.插件.组件,属于静态网页 区分动态网页与静态网页的基本方法: ---->>>>第一看后缀名,第二看是否能与服务器发生交互行为. 静态页面特点: 静态网页是相对于动态网页而言,是指没有后台数据库.不含程序和不可交互的网页.你编的是什么它显示的就是什么.不会有任何改变. 静态网页相对更新起来比较麻烦,适用于一般更新较少的展示型网站 静态网页是

静态网页与动态网页区别（转）

静态网页,动态网页主要根据网页制作的语言来区分: 静态网页使用语言:HTML(超文本标记语言) 动态网页使用语言:HTML+ASP 或 HTML+PHP 或 HTML+JSP 等. 静态网页与动态的区别 程序是否在服务器端运行,是重要标志.在服务器端运行的程序.网页.组件,属于动态网页,它们会随不同客户.不同时间,返回不同的网页,例如ASP.PHP.JSP.ASP.net.CGI等.运行于客户端的程序.网页.插件.组件,属于静态网页,例如html页.Flash.JavaScript.VBScri

静态网页与动态网页区别

静态网页 1.静态网页每个网页都有一个固定的URL,且网页URL以.htm..html..shtml等常见形式为后缀,而不含有“?”: 2.网页内容一经发布到网站服务器上,无论是否有用户访问,每个静态网页的内容都是保存在网站服务器上的,也就是说,静态网页是实实在在保存在服务器上的文件,每个网页都是一个独立的文件: 3.静态网页的内容相对稳定,因此容易被搜索引擎检索: 4.静态网页没有数据库的支持,在网站制作和维护方面工作量较大,因此当网站信息量很大时完全依靠静态网页制作方式比较困难: 5.静态网

Java Web学习(2)：静态网页与动态网页

一静态网页 (1)静态网页概述 在网站设计中,纯粹HTML(标准通用标记语言下的一个应用)格式的网页通常被称为"静态网页",静态网页是 标准的HTML文件,它的文件扩展名是.htm..html,可以包含文本.图像.声音.FLASH动画.客户端脚本和ActiveX 控件及JAVA小程序等.静态网页是网站建设的基础,早期的网站一般都是由静态网页制作的. 静态网页是相对于动态网页而言,是指没有后台数据库.不含程序和不可交互的网页.静态网页相对更新起来比 较麻烦,适用于一般更新较少的展示型网站

web学习---html，js，php，mysql一个动态网页获取流程

使用bootstrap的cms模版系统搭建了一个信息管理系统.通过这个系统学习动态网页获取的工作流程. 抓包分析一个页面的数据请求流程如下图所示: 同样,对于需要向数据库插入数据,可以使用ajax接口向php后台发送参数,php脚本解析后通过与mysql的接口写入数据库. 需要注意的是php5.5的版本的mysql接口与php4.*的接口不同,不能向下兼容.php 5.* 对应的是mysqli_connect,php 4.*对应的是mysql_connect

动态网页脚本语言

在ASP .PHP.JSP环境下,HTML代码主要负责描述信息的显示样式,而程序代码则用来描述处理逻辑.普通的 HTML页面只依赖于Web服务器,而ASP .PHP.JSP页面需要附加的语言引擎分析和执行程序代码.程序代码的执行结果被重新嵌入到HTML代码中,然后一起发送给浏览器.ASP .PHP.JSP三者都是面向Web服务器的技术,客户端浏览器不需要任何附加的软件支持. 二.技术特点: (一)ASP的技术特点: 1. 使用VBScript .JScript等简单易懂的脚本语言,结合HTML代

静态WEB与动态WEB的区别

 1.静态 WEB    静态 WEB指的以*.htm.*.html 为后缀的网页,这些网页的访问只是从服务器上读取这些内容,然后返回给客户端浏览器解析呈现在用户面前.不过静态WEB也有缺点,所有用户看到的效果一样,无法实现与用户动态交互:不能登录验证,连接数据库等.  2.动态WEB    动态 WEB是指利用某些技术实现连接数据库,能够与用户交互,使 WEB的展示效果“因时因人而变”.它的好处是能够连接数据库,实现与用户的交互.     强调一点,本不是网站中有动态的效果就是动态WEB,动态