不同浏览器的工作方式不完全一样,大体上,浏览器的核心是浏览器引擎,目前市场占有率最高的几种浏览器几乎都使用了不同的浏览器引擎:IE使用的是Trident、Firefox使用的是Gecko、Safari和Chrome使用的是Webkit。不同的浏览器引擎对W3C的规范支持不尽相同。下面讲诉浏览器从输入URL地址开始到页面完全可用的大致过程。

1.连接到URL所在服务器

用户在地址栏中输入一个URL,并单击GO按钮要求浏览器打开该URL后,浏览器做的第一件事情是寻找该URL所在服务器,通过向DNS服务器查询,浏览器可以获得该URL所在网站的IP地址。然后,浏览器向该地址发起连接请求,建立到服务器的连接。

2.获取页面对应的HTML文档

当连接建立后,浏览器向服务器发送HTTP请求,请求URL对应的HTML文档。不管请求的URL是一个静态的HTML文件,还是一个动态脚本(ASPX、PHP或JSP),服务器返回给浏览器的一定是HTML文档。该HTML文档就是浏览器需要呈现的页面

3.解析文档并获取所需要的资源

浏览器在获取HTML文档后会对文档进行解析,目的是知道该页面需要哪些资源以及生成DOM树。生成DOM树的工作与下载页面上需要的其它资源同时进行。大致来说,浏览器会逐行分析HTML文档,一旦发现一个标签,就会根据标签的要求分配对指定资源的下载。当DOM树生成后,DOMContentLoaded事件被触发。

首先,理论上浏览器并行下载页面需要的所有资源会带来最好的性能体验,但由于服务器要保证对尽可能多的用户的支持,因此HTTP/1.1规定了每个客户端只能与每个服务器建立2个连接。

其次,并非所有的元件都可以被并行下载。一般情况下,页面中包含两类需要被执行的JavaScript脚本,一类是直接用<script>标签标识的内嵌的JS语句;另一类则是引用外部的JS文件

4.页面上的JS文件与CSS文件

5.Onload事件

当HTML文档解析完成,生成了DOM树,所有页面需要的资源文件都已经成功下载和执行后,浏览器会发出Onload事件并回调HTML文档中的onload函数。

浏览器打开URL的方式和加载过程的更多相关文章

  1. delphi http 403 获取不到服务器返回的错误消息 用浏览器打开url可以返回

    用delphi的idhttp Get一个url如下: http://117.135.237.4:9090/agent/api/treatmentModeUpdate?userName=VDAwMIMQ ...

  2. quick 用系统浏览器打开url

    需求描述: 在我们的游戏里面增加一个链接,直接用浏览器打开,进入到对应网站,进行一些支付活动. 解决: 于是我去百度了一下,发现了这篇文章,http://blog.csdn.net/teng_onth ...

  3. ELF文件的格式和加载过程

    http://blog.csdn.net/lingfong_cool/article/details/7832896 (一) ELF 文件的格式       ELF 文件类型 (1) 可重定位文件(  ...

  4. Qt 调用本地浏览器打开URL

    点击Qt某些控件,查找本地浏览器打开前端传递的URL. 方法一:直接写死本地浏览器地址 QString programAdress = "C:\Program Files (x86)\Goo ...

  5. Android 用Chrome浏览器打开url 自定义样式

    1.效果预览 1.1.真实效果就是从某一个APP,打开一个url,跳转到谷歌浏览器,返回之后,又回到之前的APP      1.2.说明一下条件 1.手机上必须要安装谷歌浏览器 2.手机上的默认浏览器 ...

  6. 从浏览器输入url到页面加载完成都发生了什么

    一个http请求的过程 简要介绍一下一个http请求的网络传输过程: DNS Lookup先获得URL对应的IP地址 Socket Connect浏览器和服务器建立TCP连接 Send Request ...

  7. 输入URL到页面加载过程

    URL(uniform resource location) : 统一资源定位符,用来作为互联网上各种资源的标识符,可理解为身份证号 . 注意点:浏览器为了保证安全性,设定了跨域保护策略, 即窗口之间 ...

  8. 从浏览器输入URL到页面渲染的过程

    零.背景 一个web安全工程师在学习web安全和web渗透时候,非常有必要了解整个WEB工作过程. 一.输入URL 这里是最基本的知识:URL是URI的一种实际应用,URI统一资源表示符,URL统一资 ...

  9. SpringMVC DispatcherServlet 启动和加载过程(源码调试)

    在阅读本文前,最好先阅读以下内容(当然,如果对 Servlet 已经有所了解,则可跳过): http://www.cnblogs.com/cyhbyw/p/8682078.html http://ww ...

随机推荐

  1. Android FragmentPagerAdapter和FragmentStatePagerAdapter的区别

    FragmentPagerAdapter官方解释: This version of the pager is best for use when there are a handful of typi ...

  2. error C2664: “LoadLibraryW”: 不能将参数 1 从“const char *”转换为“LPCWSTR”

    在使用VS2010编写运行时动态链接dll文件时出现的一个问题,问题解决得益于此文章: http://blog.sina.com.cn/s/blog_6a2236590100xbgl.html 通过调 ...

  3. jQuery prop 全选和全不全

    $('#ckAll').click(function() { var value = $(this).is(':checked') ? true : false; $("input[name ...

  4. CodeForces 225C Barcode DP

    也是一道dp ,想到了就会觉得很巧妙 矩阵中只有白块和黑块,要求repaint后满足下述条件: 每列一种颜色 根据输入范围x, y 要求条纹宽度在[x, y] 之间 数据范围: n, m, x and ...

  5. Codeforces 489C Given Length and Sum of Digits...

    m位长度,S为各位的和 利用贪心的思想逐位判断过去即可 详细的注释已经在代码里啦~ //#pragma comment(linker, "/STACK:16777216") //f ...

  6. 用python解析html

    python中,有三个库可以解析html文本,HTMLParser,sgmllib,htmllib.他们的实现方法不通,但功能差不多.这三个库中 提供解析html的类都是基类,本身并不做具体的工作.他 ...

  7. php 遍历文件夹及文件,获取文件名和文件路径存入数据库中

    <?php header("Content-Type:text/html; charset=gbk"); require('../../include/connect.php ...

  8. 网页制作之html基础学习5-background-position用法

    我们知道在用图片作为背景的时候,css要这样写,以div容器举例子,也可以是body.td.p等的背景,道理一样. 代码: div{ background:#FFF url(image) no-rep ...

  9. 08-UIKit(UITableTableViewCell、自定义Cell、xcode调试)

    目录: 1. UITableTableViewCell 2. tag技术 3. 自定义Cell 4. 用nib文件构造自定义的静态表 5. TableView数据模型总结 6. Xcode代码调试 & ...

  10. WCF技术剖析之二十三:服务实例(Service Instance)生命周期如何控制[下篇]

    原文:WCF技术剖析之二十三:服务实例(Service Instance)生命周期如何控制[下篇] 在[第2篇]中,我们深入剖析了单调(PerCall)模式下WCF对服务实例生命周期的控制,现在我们来 ...