简单对Web请求响应如何处理进行的整理，难免有理解不到位，理解有偏差的地方，如有理解有误的地方，希望大牛批评指正。

1.Web开发的定义
首先看看微软对Web开发的定义:
Web开发是一个指代网页或网站编写过程的广义术语。网页使用 HTML、CSS 和 JavaScript编写。这些页面可能是类似于文档的简单文本和图形。页面也可以是交互式的，或显示变化的信息。编写交互式服务器页面略微复杂一些，但却可以实现更丰富的网站。如今的大多数页面都是交互式的，并提供了购物车、动态可视化甚至复杂的社交网络等现代在线服务。

通俗的说,Web开发就是我们说的做网站.它分为网页部分和逻辑部分也就是我们说的前台页面展示与后台业务逻辑处理。前台负责与用户的交互显示数据，用到HTML标签布局页面,CSS样式渲染页面,JavaScript脚本(或AJAX、JQuery、Extjs)编写动态交互性强的页面；后台编写处理一些复杂业务逻辑的程序.可以用C#,JAVA,PHP等语言。

2.Web请求响应简单理解
客户端浏览器对服务器端进行一次请求的演示图：


<1>.客户端发送请求。客户端浏览器向服务器发送请求URL；
<2>.服务器接收请求。服务器接收到该浏览器发送的请求；
<3>.服务器生成HTML。服务器解析请求的URL，根据URL确定请求的目标资源文件；
　　 这个资源文件通常是一个动态页面（如ASP，PHP，JSP，ASPX等文件）的网络地址（MVC结构的程序例外）。Web服务器根据动态页面文件的内容和URL中的参数，调用相应的资源（数据库数据或图片文件等等）组织数据，生成HTML页面。
<4>.服务端响应请求。生成HTML文档以后，服务器响应浏览器的请求，将生成的HTML文档发送给客户端浏览器；
<5>.客户端接收响应。浏览器接收服务端发出的请求得来HTML文档；
<6>.客户端解析HTML。浏览器对HTML文档进行解析，并加载相关的资源文件（JS，CSS，多媒体资源，内嵌网页）等，(在这里浏览器解悉完HTML文档以后，就会进行呈现，但同时也会向服务器发送请求来请求其它相关的资源文件)
<7>.服务器发送资源文件。服务器接到浏览器对资源文件的请求，将相应的资源文件响应给客户端浏览器；
<8>.客户端加载资源文件。客户端浏览器将接收服务器发送的资源文件，整理并呈现到页面中；
<9>.客户端从上到下加载。在进行页面呈现的时候，浏览器会从上到下执行HTML文档，当遇到相应的页面脚本的时候，会对脚本进行分析，并解释执行相应的脚本代码。

在第6步以后，我们就可以看到一部分页面内容了，不过可能是纯文本内容，没有样式，没有图片或其它资源。待到浏览器请求得到某资源的时候就会进行组织呈现，直到整个页面所有资源加载完毕,显示完成，请求响应完毕。

3.客户端解析HTML
<1>.解析HTML结构；
<2>.加载外部脚本和样式表文件；
<3>.解析并执行脚本代码；
<4>.构造HTML DOM模型；
<5>.加载图片等外部文件。

加载顺序实例：

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title>Title</title>

<style type="text/css">

body

{

font-sie: 12px;

}

</style>

<link href="style.css" rel="stylesheet" type="text/css" media="all" />

<script src="js.js" type="text/javascript"></script>

</head>

<body>

<div>

<script type="text/javascript">

function f1() { }

</script>

<img src="1.gif" />

</div>

<script type="text/javascript">

function f2() { }

</script>

</body>

</html>

html → head → title → #text(网页标题) → style → 加载样式 → 解析样式 → link → 加载外部样式表文件 → 解析外部样式表 → script → 加载外部脚本文件 → 解析外部脚本文件 → 执行外部脚本 → body → div → script → 加载脚本 → 解析脚本 → 执行脚本 → img → script → 加载脚本 → 解析脚本 → 执行脚本 → 加载外部图像文件 → 页面初始化完毕

4.onload和ready的差异
这里需要注意的是onload和ready的差异：
一是ready，表示DOM文档树已经加载解析解析完成（不包含图片等非文字媒体文件）；
二是onload，指页面上所有的资源(包含图片等文件在内的所有元素)都加载完毕。

说ready比onload快最显著的是比如一个页面上有一个很大的图片，加载要好久，onload只有在图片加载完成之后执行，而ready不必等图片加载完成。
这种差异与window.onload和$(document).ready()的区别也是一致的吧。

5.Web相关技术和标准

参考博客：
《DOM加载顺序》
《深入理解BS结构应用程序》

Web请求响应简单整理的更多相关文章

  1. .NET Web开发技术简单整理

    在最初学习一些编程语言.一些编程技术的时候,做的更多的是如何使用该技术,如何更好的使用该技术解决问题,而没有去关注它的相关性.关注它的理论支持,这种学习技术的方式是短平快.其实工作中有时候也是这样,公 ...

  2. 转载：.NET Web开发技术简单整理

    在最初学习一些编程语言.一些编程技术的时候,做的更多的是如何使用该技术,如何更好的使用该技术解决问题,而没有去关注它的相关性.关注它的理论支持,这种学习技术的方式是短平快.其实工作中有时候也是这样,公 ...

  3. .NET Web开发技术简单整理 转

    .NET Web开发技术简单整理 原文:http://www.cnblogs.com/SanMaoSpace/p/3157293.html 在最初学习一些编程语言.一些编程技术的时候,做的更多的是如何 ...

  4. web请求响应

    转载自:SanMaoSpace 1.Web开发的定义首先看看微软对Web开发的定义:Web开发是一个指代网页或网站编写过程的广义术语.网页使用 HTML.CSS 和 JavaScript编写.这些页面 ...

  5. Web 请求响应原理(转)

    用Java实现Web服务器 减小字体 增大字体 摘要:WWW的工作基于客户机/服务器计算模型,由Web 浏览器(客户机)和Web服务器(服务器)构成,两者之间采用超文本传送协议(HTTP)进行通信,H ...

  6. Fiddler修改http请求响应简单实例

    Fiddler是一个http调试代理,它能够记录并检查所有你的电脑和互联网之间的http通讯. 主要功能 设置断点,查看Fiddle说有的进出的数据(指cookie,html,js,css等文件,这些 ...

  7. ASP.NET Web API 记录请求响应数据到日志的一个方法

    原文:http://blog.bossma.cn/dotnet/asp-net-web-api-log-request-response/ ASP.NET Web API 记录请求响应数据到日志的一个 ...

  8. Web Service之Soap请求响应内容中文编码解密

    java模拟Soap请求测试Web Service接口,发现Web Service响应内容中的中文竟然是编码格式.比如: 中文:退保成功 Soap中文编码:退保成功   我仔细分析后发现,退编码实际上 ...

  9. Http协议简单解析及web请求过程

    HTTP协议: HTTP是一个属于应用层的面向对象的协议,由于其简捷.快速的方式,适用于分布式超媒体信息系统. 基于HTTP协议的客户端/服务器请求响应机制的信息交换过程包含下面几个步骤: 1)    ...

随机推荐

  1. Nginx Location配置总结及基础最佳实践

    参考来源: http://blog.zol.com.cn/1067/article_1066186.html,http://flandycheng.blog.51cto.com/855176/2801 ...

  2. WPF中Expander控件样式，ListBox的样式(带checkbox)恢复

    Expander控件样式: <ControlTemplate x:Key="ExpanderToggleButton" TargetType="ToggleButt ...

  3. 几种解析xml方式的比较

    1: DOM DOM 是用与平台和语言无关的方式表示 XML 文档的官方 W3C 标准.DOM 是以层次结构组织的节点或信息片断的集合.这个层次结构允许开发人员在树中寻找特定信息.分析该结构通常需要加 ...

  4. Mac 启用http-dav功能(WebDAV服务器)

    启用Mac的WebDAV可以实现文件的上传以及Windows.Linux和Mac之间的数据互传. 客户端使用:windows下使用网上邻居 --> 添加一个网上邻居  --> 输入uplo ...

  5. Tesseract初探

    一.框架介绍 Tesseract 是一款图片识别工具,可以抓取图片中的文字,可以支持多种语言(默认是英语),需要下载开源文件可以在github上下载,如果知识应用不想太多深究直接在google cod ...

  6. MySQL中字符串函数详细介绍

    MySQL字符串函数对于针对字符串位置的操作,第一个位置被标记为1. ASCII(str)返回字符串str的 最左面字符的ASCII代码值.如果str是空字符串, 返回0.如果str是NULL,返回N ...

  7. win8 优化笔记

    win8可以关掉的服务: 以下是小编搜集的可以安全更改为手动启动的服务(按名称排序): Application Experience(启动时为程序处理应用程序兼容性缓存请求) ·Computer Br ...

  8. 让wordpress分类和标签的描述支持HTML代码

    默认 WordPress 后台分类和标签的编辑页面,分类和标签的描述是不支持 HTML 代码的,我们可以通过在当前主题的 functions.php 文件添加如下代码让分类和标签的描述支持 HTML ...

  9. FireFly 服务端 Unity3D黑暗世界 客户端 问题

    启动服务端成功截图: 连接成功截图: 测试服务端是否启动成功: 在Web输入:http://localhost:11009/  按回车 (查看cmd启动的服务端 是否多出如下显示) 服务端启动成功.P ...

  10. C++中的构造函数，拷贝构造函数和赋值运算

    关于C++中的构造函数,拷贝构造函数和赋值运算,以前看过一篇<高质量C++/C编程指南>的文章中介绍的很清楚,网上能搜索到,如果想详细了解这方面的知识可以参看一下这篇文章. 常见的给对象赋 ...