Web开发技术简介

最新推荐文章于 2023-06-13 16:31:32 发布
最新推荐文章于 2023-06-13 16:31:32 发布
阅读量1.3k 收藏 2
点赞数
分类专栏： Web
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ling091/article/details/22677055
版权
                                                                                                                                                                    @Mar 18,2014 

Web开发中充斥了太多的技术名词，本文整理了一下，介绍各个技术适合做什么。内容主要是：

  -  前台: HTML(XHTML，CSS),JavaScript( jQuery, AJAX, JSON)

  -  后台: CGI, ASP,JSP, PHP

需要说的是W3school是一个很好的学习Web技术的网站http://www.w3school.com.cn/）本文内容主要来自该网站

1       HTML

超文本标签语言，用来写页面。下面的html代码显示一段文字：

<html>

<body>

<h1> Heading</h1>

<p>This is a paragraph.</p>

</body>

</html>

2       XHTML

XHTML 可扩展超文本标记语言，是作为一种 XML 应用被重新定义的更严谨更纯净的 HTML，是HTML 版本，目标是取代HTML。

3       HTML5

HTML5是下一代的HTML，它将成为 HTML、XHTML 以及 HTML DOM 的新标准，仍处于完善之中。然而，大部分现代浏览器已经具备了某些 HTML5 支持。

HTML5提供了诸多新特性：

  • HTML5 提供了展示视频的标准
  • 新的表单控件，比如 calendar、date、time、email、url、search
  • 更好本地离线存储支持，提供两种在客户端存储数据的新方法：没有时间限制的数据存储和针对Session的数据存储，HTML5还可以创建离线缓存，供离线浏览
  • 允许网页自动获得来自服务器的更新，这一点很重要，在此之前这需要网页不断发送请求来实现。HTML5中通过服务器发送事件，更新能够自动到达，使用的例子包括网页聊天应用，火车票量更新，股价动态等
  • 运行在后台的 JavaScript，不会影响页面的性能。当在 HTML 页面中执行脚本时，页面的状态是不可响应的，直到脚本已完成，有了后台的 JavaScript，用户则可以继续做动作
  • 提供canvas 元素，可以使用 JavaScript 在网页上绘制图像
  • 支持新的特殊内容元素，比如 article、footer、header、nav、section

4       CSS

定义如何显示html.下面的CSS定义一个一段文字的样式:

<head>

<style type="text/css">

 .title1 {font:bold14px Arial, Helvetica, sans-serif; color: #993300;line-height:35px; letter-spacing:.2em;margin-top: 10px;

   margin-bottom: 8px; border-bottom: 2px solid #bcbcbc;}

</style>

</head>

<div class="title1">新特性</div>

 

显示效果如下：


5       CSS3

CSS3是最新的CSS, W3C（W3C 指 World WideWeb Consortium，万维网联盟）仍然在对 CSS3 规范进行开发。不过，现代浏览器已经实现了相当多的 CSS3 属性。浏览器通常支持CSS2。

使用CSS3可以实现很多特性，如

  • 很容易创建CSS2中需要技巧才能实现的圆角边框
  • 创建动画，这可以在许多网页中取代动画图片、Flash 动画以及 JavaScript
  • 实现过渡效果，即元素从一个样式到另一个样式的过渡，如文本从小到大
  • 多列，创建多个列来对文本进行布局，就像报纸那样
  • 重设元素尺寸，如用户可以拖拽大小的文本框
  • 2D/3D转换，如rotate，scale, translate, matrix，skew
  • 更强大的背景、文本效果，如背景重影，自动换行

6       HTTP协议

HTTP协议（HyperTextTransfer Protocol，超文本转移协议）是用于从WWW服务器传输超文本到本地浏览器的传送协议。它是一个应用层协议，由请求和响应构成，是一个标准的客户端服务器模型。

HTTP是一个无连接无状态的协议。无连接是指每次只处理一个请求，请求完成后即断开连接，这样可以节省传输时间。无状态是指协议对于事务处理没有记忆能力，所以后续处理需要前面的信息就需要重传[11]。

HTTP/1.1协议定义了多种方法（“动作”）来表明Request-URI指定的资源的不同操作方式，如HEAD，GET，POST。客户端向服务器发送一个请求，服务器以一个状态行作为响应，响应的内容包括：消息协议的版本、成功或者错误编码、服务器信息、实体元信息以及必要的实体内容。

几个比较重要的HTTP状态码：400(Badrequest), 403(Forbidden), 404(Not found)，410(Gone，已不存在)。

可以通过Wireshark（一个非常棒的开源网络包分析软件）来抓TCP，HTTP包来分析发送过程或调试程序。

Note：HTTP与TCP/IP的关系，TPC/IP协议是传输层协议，主要解决数据如何在网络中传输，而HTTP是应用层协议，主要解决如何包装数据。形象地比喻是 “我们在传输数据时，可以只使用（传输层）TCP/IP协议，但是那样的话，如果没有应用层，便无法识别数据内容，如果想要使传输的数据有意义，则必须使用到应用层协议，应用层协议有很多，比如HTTP、FTP、TELNET等，也可以自己定义应用层协议。WEB使用HTTP协议作应用层协议，以封装HTTP 文本信息，然后使用TCP/IP做传输层协议将它发到网络上。”

　　把IP想像成一种高速公路，它允许其它协议在上面行驶并找到到其它电脑的出口。TCP和UDP是高速公路上的“卡车”，它们携带的货物就是像HTTP，文件传输协议FTP这样的协议等[7]。

7       TCP/IP

TCP/IP（Transmission Control Protocol/ InternetProtocol传输控制协议/网际协议）是针对因特网的通信协议，定义了电子设备（比如计算机）如何连入因特网，以及数据如何在它们之间传输。

浏览器和服务器都是用该协议。浏览器使用TCP/IP 来访问因特网服务器，服务器使用 TCP/IP 向浏览器传回 HTML。

在 TCP/IP 中包含一系列用于处理数据通信的协议：

  • TCP (传输控制协议) - 应用程序之间通信
  • UDP (用户数据包协议) - 应用程序之间的简单通信
  • IP (网际协议) - 计算机之间的通信
  • ICMP (因特网消息控制协议) - 针对错误和状态
  • DHCP (动态主机配置协议) - 针对动态寻址

7.1     TCP使用固定的连接

TCP 用于应用程序之间的通信，。

当应用程序希望通过 TCP 与另一个应用程序通信时，它会发送一个通信请求。这个请求必须被送到一个确切的地址。在双方“握手”之后，TCP 将在两个应用程序之间建立一个全双工 (full-duplex) 的通信。

7.2     IP 是无连接的

IP 用于计算机之间的通信，负责将每个包路由至它的目的地。

通过 IP，消息（或者其他数据）被分割为小的独立的包，并通过因特网在计算机之间传送。

7.3       域名

每个计算机必须有一个 IP 地址才能够连入因特网。数字的地址很难记忆，为其命名的名称就是域名，在浏览器中键入域名，会被一种 DNS 程序翻译为数字。在全世界，数量庞大的 DNS 服务器被连入因特网，负责将域名翻译为 TCP/IP 地址。

7.4     TCP/IP

TCP/IP 意味着 TCP 和 IP 在一起协同工作。

TCP 负责应用软件（比如你的浏览器）和网络软件之间的通信。IP 负责计算机之间的通信。

TCP 负责将数据分割并装入 IP包，然后在它们到达的时候重新组合它们。IP 负责将包发送至接收者。

8       JavaScript

JavaScript 是一种轻量级语言，被设计为向 HTML 页面增加交互性。Javascript可嵌入到html中，由浏览器解释执行。

下面是一个生成文本的JavaScript脚本的例子：

<html>

<body>

<script type="text/javascript">document.write("HelloWorld!")</script>

</body>

</html>

9       jQuery

jQuery是一个JavaScript库，它极大的简化了JavaScript的编程。比如JavaScript要根据ID获取HTML文档的元素需要这样写：document.getElementById(“my_id”)，使用jQuery则只需要写成$(“#my_id”)。

10  JSON

JSON：JavaScript 对象表示法（JavaScriptObject Notation），是存储和交换文本信息的语法。类似 XML，但更小、更快、更容易解析，语法是 JavaScript 对象表示法语法的子集，能够用javascript eval()方法进行解析。JSON可使用 AJAX 进行传输。

JSON 最常见的用法之一，是从web 服务器上读取 JSON 数据（作为文件或作为 HttpRequest），将 JSON 数据转换为 JavaScript 对象，然后在网页中使用该数据。

11  Cookie

Cookie是网站为了辨别用户身份、进行session跟踪而储存在用户本地终端（浏览器）上的数据（通常经过加密），比较典型的例子是保存用户状态（如网站内不同网页避免多次登录），跟踪用户行为（如购物车）等。

Cookie由服务器端生成，发送给客户端（一般是浏览器），浏览器会将Cookie的key/value保存到某个目录下的文本文件内，下次请求同一网站时就发送该Cookie给服务器。Cookie也跨一个域名下的多个网页使用，但是不能跨域名。

Cookie是浏览器提供的一种机制，它将document 对象的cookie属性提供给JavaScript，可由JavaScript对其进行控制。通过Cookie可以达到JavaScript中全局变量的效果。

需要注意的是浏览器可以禁用Cookie，，Cookie可以被用户删除，安全性不够高，不同浏览器对Cookie的个数和大小有不同限制。

12  AJAX

AJAX (AsynchronousJavaScript and XML)，是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术，用来创建动态性更强的网页。主要技术仍然是javascript和xml。

由于HTTP是一种无状态无连接协议，很难实现服务器主动更新，如股价波动、聊天这样的应用。只

能采用网页不断全部刷新或局部刷新（网页插入一个隐藏的iframe，通过iframe不断自动刷新或轮询服务器来更新数据）。

使用Ajax，可以发送异步的HTTP请求，并且可以只对网页部分内容进行更新。使用AJAX的例子包括新浪微博、Google地图、开心网等。

HTML5则提供了专用的持久连接套接字，能够实现真正的服务器主动发数据给客户端。

ExtJS ExtJS可以用来开发RIA也即富客户端的AJAX应用，是一个用javascript写的，主要用于创建前端用户界面，是一个与后台技术无关的前端AJAX框架。ExtJS要比开发者直接针对DOM、W3C对象模型开发UI组件轻松

13  CGI

CGI（CommonGateway Interface 公共网关接口），是描述符客户端和服务器程序之间传输数据的一种标准，它定义了Web服务器如何向扩展应用程序发送消息，在收到扩展应用程序的信息后又如何进行处理等内容。

CGI程序运行在服务器端，负责响应客户端发送的请求。CGI的一个目的是独立于编程语言，因此可以用大多数语言语言来写，如Java,，C/C++，VB，Perl(字符串处理能力强大)等。

CGI的工作原理是浏览器通过HTML表单或超链接请求指向HTML或CGI应用程序的URL。在服务器上，运行产着一个守护进程对端口进行监听来自客户的请求。当一个请求到来时，将创建一个子进程为用户的连接服务。根据请求的不同，服务器返回HTML文件或者调用相应的CGI程序处理。CGI程序处理后将结果格式化为网络服务器和浏览器能够理解文档（通常HTML网页）返回给浏览器。

一个CGI的例子：

Html:

<form method="POST"enctype="multipart/form-data"action="../cgi-bin/Login.cgi">…</form>

CGI:用C实现一个Loin.cgi， main函数根据用户名和密码判断是否登录成功，然后跳转到某页面，生成的Login.exe重命名为Login.cgi，放到服务器相应目录。

 

由于每次请求都会创建一个新的进程处理，所以可能会造成服务器负载较大。

FAST-CGI是较新的标准，架构上和CGI大为不同，是用一个驻留内存的服务进程向网站服务器提供脚本服务，速度和效率比CGI大为提高[4]。

14  JSP

JSP(Java ServerPages)，其根本是一种简化的Servlet技术。

 

(Java Servlet是一种独立于平台和协议的服务器端的Java应用程序，可以生成动态的Web页面。虽然servlet可以对任何类型的请求产生响应，但通常只用来扩展Web服务器的应用程序。Java Servlet技术为这些应用程序定义了一个特定于HTTP的servlet类[5]。

Servlet与CGI 在传统CGI中，如果有N个并发的对同一CGI程序的请求，则该CGI程序的代码在内存中重复装载了N次；而对于Java Servlet，处理请求的是N个线程，只需要一份Servlet类代码。在性能优化方面，Servlet也比CGI有着更多的选择[3]。）

 

JSP允许将Java代码嵌入到HTML页面中（通过<%...%>），后缀名.jsp。Web服务器在遇到访问JSP网页的请求时，首先执行其中的程序段，然后将执行结果连同JSP文件中的HTML代码一起返回给客户端。插入的Java程序段可以操作数据库、重新定向网页等，以实现建立动态网页所需要的功能。

 

Note：普通的 HTML页面只依赖于Web服务器， JSP页面需要附加的语言引擎分析和执行程序代码(ASP和PHP也一样)。JSP代码会被编译成 Servlet并由Java虚拟机解释执行，这种编译操作仅在对JSP页面的第一次请求时发生。

15  Node.js

Node 是一个服务器端JavaScript 解释器(传统方式是JavaScript运行在客户端浏览器中)，它将改变服务器应该如何工作的概念。它的目标是帮助程序员构建高度可伸缩的应用程序，编写能够处理数万条同时连接到一个（只有一个）物理机的连接代码。

在 Java和 PHP 这类语言中，每个连接都会生成一个新线程，每个线程要花费一定的资源，这也就决定了一台机器能够允许的最大连接数。为了支持更多客户，就需要增加服务器。

Node 解决这个问题的方法是：更改连接到服务器的方式。每个连接发射一个在 Node 引擎的进程中运行的事件，而不是为每个连接生成一个新的 OS 线程（并为其分配一些配套内存）[9]。

Node擅长的地方是处理体积小的请求以及基于事件的I/O，使用Node解决客户端和服务器之间的快速沟通，如twitter短时间需要处理成千上万条数据[10]。

 

16  参考

[1*] COMET服务器推技术，实现Web服务器“主动”向客户端发送数据.

http://www.360doc.com/content/11/0617/16/597197_127627804.shtml

[2] CGI和ASP, PHP的关系. http://zhidao.baidu.com/question/81214621.html?qbl=relate_question_0&word=PHP%20CGI

[3] Java Servlet与Applet、CGI、JSP的比较.http://developer.51cto.com/art/200907/133695.htm

[4]CGI是什么. http://zhidao.baidu.com/link?url=-KCy7-dfWkbdeg6rooO0noakdy7i0_6766Gu-Vr3QPkvqcKW2dfETaIcsYIRKkSv-Qb7kEYRXafYehPKqIW9na

[5] JSP. http://baike.baidu.com/link?url=_4hZmFlZeOkBaGKXJmq2mzUYtWzbkobKp0TmfmNqNXj1sb5-0Tu_d6bgdvxm0snR

[6] HTTP超文本传输协议. http://baike.baidu.com/link?url=d96fAagW3cPa3yqV6K_se-RYQqAIhXA6Mb58OkPKGl3sjw6A90epuWmK85MuuK64DQcDoikqG7qsMkQu3EEt7a

[7*] TCP/IP、Http的区别.

http://www.cnblogs.com/renyuan/archive/2013/01/19/2867720.html

[8] js中cookie的使用详细分析. http://cache.baiducontent.com/c?m=9d78d513d9921cf201b6c36a4a5689694312c6212bd6a3086291d60d84642c191761e0ac27554c5395d82f2747f41802bded3574300724a09bbfd20c82&p=917bc64ad4d911a058eb9f66544c96&newp=882a9543dd9915fc57efdc21584381231610db2151d4d71e2580&user=baidu&fm=sc&query=cookie&qid=&p1=6

[9*] Node.js 究竟是什么？. http://www.ibm.com/developerworks/cn/opensource/os-nodejs/

[10] 什么是Node.js. http://www.open-open.com/bbs/view/1318473088937

[11*] HTTP 协议详解. http://blog.csdn.net/gueter/article/details/1524447

[12*] 深入理解HTTP协议. http://www.360doc.com/content/10/0930/17/3668821_57590979.shtml

[13*] Cookie/Session机制详解. http://blog.csdn.net/fangaoxin/article/details/6952954


 

 

 

 

 

 

 


ling091
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
计算机Web开发技术简介
12-07
Web开发技术简介，很好的资料哦，千万记得下载，一定哟
web开发技术
m0_56161893的博客
06-28 3827
WEB在英语中web即表示蜘蛛网的意思，它用于表示Internet主机上（服务器）供外界访问的资源 Web应用程序是一种可以通过Web访问的应用程序。Web应用程序的一个最大好处是用户很容易访问应 用程序。用户只需要有浏览器即可，不需要再安装其他软件。 应用程序有两种模式C/S、B/S。 C/S是客户端/服务器端程序，也就是说这类程序一般独立运行。 B/S就是浏览器端/服务器端应用程序，这类应用程序一般借助服务器运行，需要IE等浏览器来查看 运行结果。 ...
web开发技术简介
08-17
很好很详细的web开发，很适合刚开始接触web开发的新手入门
开发Web应用有哪些技术
Nick的博客
06-13 3225
Web框架：例如Django（Python）、Ruby on Rails（Ruby）、Spring（Java）等，提供了一组工具和库简化Web应用的开发。- CSS预处理器（如Sass、Less）和构建工具（如Webpack、Gulp）：用于提高CSS和JavaScript代码的编写效率和维护性。- 用户认证和授权机制：例如基于角色的访问控制（RBAC）、OAuth等，用于管理用户的身份验证和授权。- RESTful API：一种基于HTTP协议的设计风格，用于构建可扩展的和易于集成的Web服务。
web前端开发介绍
热门推荐
淘小欣的博客
03-02 1万+
前端内容介绍 一、什么是前端 应用软件组成：前端＋后端 后端负责处理业务逻辑＆提供数据，任何与用户直接打交道的操作界面都可以称之为前端，主要负责页面展示、与用户交互等等下面都是前端： 公司官网（在PC通过浏览器来访问公司网站） 移动端网页（在手机上来浏览公司信息、小游戏等） 移动端APP（例如：淘宝、去哪儿旅游、携程等） 微信小程序（微信最新推出的功能，随用随装，不占用手机空间）。 前端开发是从网页制作演变而来的。 早期的网页制作主要内容都是静态的，以文字图片为主，用户使用网站也以浏览为主。 随着互联网
Web前端开发
07-13
介绍Web前端开发技术及开发工具。web前端主要职能。
主流Web开发技术简介
北冥冰辰的专栏
03-06 7825
目前使用的主流Web开发技术主要有四种：ASP、ASP.NET、JSP、PHP。 1、ASP ASP（Active Server Pages）动态服务器页面，使用VBScript脚本语言，可以将脚本语言直接嵌入HTML文档中，不需要编译就可以直接运行。 优点： ①、由于ASP程序是在服务器端运行的，当客户端浏览器访问ASP网页时，服务器将网页解释成标准的HTML代码发送给客户端，所以不
Web开发技术汇总
weixin_46048018的博客
11-21 4583
Web开发技术汇总、 一、前端部分 基础篇 1.HtTML5        HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息，可以包含文字、图片、视频等。 2.CSS3        CSS样式是表现。就像网页的外衣。比如，标题字体、颜色变化，或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西...
WEB开发技术-基础篇
GalaIO的博客
05-12 1170
本文只是简单涉猎一些内容，web及其相关技术，及其庞大，而且发展日新月异，但是底层基本不变，其余部分希望大家私下多做扩展多多学习，希望本篇可以给大家一个技术导引。
Web开发
qq_64469885的博客
04-27 1320
Web开发是分为客户端和服务器端两部分来实现的，客户端是运行在用户浏览器上的程序，主要负责展示页面和与用户进行交互；HTML、CSS和JavaScript都是基础性的技术，掌握好这三种技术对于Web开发是非常必要的。从前端到后端，再到服务器端的部署和测试，每个环节都有着自己的工具和技术，掌握它们能够让我们做出更好的Web应用程序。Web开发是指利用Web技术构建Web应用程序，随着互联网的快速发展和云计算、移动设备的普及，Web开发已经成为了现代软件开发领域中的重要组成部分。二、Web开发技术和工具。
web开发之技术简介
12-16
web开发序言以及一些基础知识的介绍，属于web资源的部分之一。
web开发网站技术
08-07
一本不错的书籍，可以拿来深入样式渲染，一本不错的书籍，可以拿来深入样式渲染一本不错的书籍，可以拿来深入样式渲染
Web开发技术.pdf
04-21
Web开发技术，Web开发技术，Web开发技术，Web开发技术
四种主流Web开发技术的比较
05-17
主要比较： ̄ Per-request execution: Common Gateway Interface (CGI). ̄ Fast CGI, Java Servlets. ̄ Templating: Microsoft Active Server Pages (ASP), Sun Java Server Pages (JSP), Hypertext Pre-Processor (PHP). ̄ Web server extensions: Server-side Includes, mod perl (for Apache), NSAPI (Netscape FastTrack), ISAPI( MS IIS).
Web开发中的基本概念和用到的技术简介
09-28
今天，本文向初学者介绍一些 Web 开发中的基本概念和用到的技术，从A到Z总共26项，每项对应一个概念或者技术,需要的朋友可以参考下
PythonWEB开发技术简介ppt及代码.zip
08-29
Python WEB开发技术简介 Django简介与环境配置与MVT设计模式简介 开发一个博客站点项目思路 路由编写与模型设计实战 快速开发一个网站后台与视图编写实战 模版设计与编写以及完善博客站点的其他功能 后续的话
Web实时更新客户端数据
章鱼之家
09-02 3640
Jan 9, 2014  By Zhang Yuling 下面内容整理自参考文章。 1        轮询方式实现客户端数据及时更新   在基于Web的即时通信、股票行情这样的系统中，需要客户端能够及时更新内容。由于B/S架构的特性（Http连接是无状态连接, 即服务器处理完客户的请求,并收到客户的应答后即断开连接），最简单的方式是通过客户端轮询的方式实现客户端刷新。 较早是将一个隐藏的
Javascript Topic
章鱼之家
11-25 1889
25款顶级的jQuery表格插件. http://www.gbtags.com/gb/share/4206.htm
web前端开发周杰伦网页
最新发布
12-12
周杰伦是一位备受欢迎的华语流行音乐歌手，他的粉丝遍布全球。为了展示周杰伦的音乐作品和个人信息，我将采用HTML、CSS和JavaScript等技术来开发他的官方网页。 首先，我将设计一个简洁但具有现代感的网页布局，以确保用户能够轻松浏览和获取信息。页面的顶部将包括周杰伦的个人照片和简介，随后是他最新发布的音乐作品和演出信息。在页面底部，我会包含一个联系方式和社交媒体链接，以便粉丝们可以与周杰伦互动。 在开发过程中，我会使用CSS来美化网页，并确保网页在各种设备上的显示效果良好。另外，我也会使用JavaScript来实现一些动态效果，比如音乐播放器或者图片轮播等，以增加网页的趣味性和交互性。 除了以上内容，我还会在网页中加入一些与周杰伦相关的视频和音频资源，让粉丝们可以欣赏他的音乐和影视作品。同时，我也会结合搜索引擎优化的技巧，以便网页能够在搜索结果中排名靠前，让更多人可以找到这个网页。 最后，我会在开发完成后不断测试和优化网站，确保用户能够获得流畅的浏览体验。通过这些努力，我希望能够为周杰伦打造一个优质的官方网页，让更多人可以了解他的音乐和艺术成就。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值