`
deng131
  • 浏览: 673695 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

浏览器加载html页面内容顺序

阅读更多
我们经常看到浏览器在加载某个页面时,部分内容先显示出来,又有些内容后显示。那么浏览器加载显示html究竟是按什么顺序进行的呢?

其实浏览器加载显示html的顺序是按下面的顺序进行的:
1、IE下载的顺序是从上到下,渲染的顺序也是从上到下,下载和渲染是同时进行的。
2、在渲染到页面的某一部分时,其上面的所有部分都已经下载完成(并不是说所有相关联的元素都已经下载完)。
3、如果遇到语义解释性的标签嵌入文件(JS脚本,CSS样式),那么此时IE的下载过程会启用单独连接进行下载。
4、并且在下载后进行解析,解析过程中,停止页面所有往下元素的下载。
5、样式表在下载完成后,将和以前下载的所有样式表一起进行解析,解析完成后,将对此前所有元素(含以前已经渲染的)重新进行渲染。
6、JS、CSS中如有重定义,后定义函数将覆盖前定义函数。

如果你的网页比较大,希望部分内容先显示出来,粘住浏览者,那么你可以按照上面的规则合理的布局你的网页,达到预期的目的。
分享到:
评论

相关推荐

    探析浏览器执行JavaScript脚本加载与代码执行顺序

    浏览器执行JavaScript脚本加载与代码执行顺序是网页开发中至关重要的一环,因为它直接影响到网页的渲染和用户体验。本文主要探讨了两种关键的概念:JavaScript脚本的阻塞性和执行顺序。 1. JavaScript脚本的阻塞性...

    网页按顺序加载 最后加载js广告

    在这个过程中,浏览器会按照HTML、CSS、JavaScript的顺序逐行解析资源,最后加载JS广告。这样的加载策略有助于优化用户体验,因为主要内容可以更快地呈现给用户,而广告通常被视为非关键元素。 首先,我们来看网页...

    详解关于html,css,js三者的加载顺序问题

    这样,浏览器在解析完页面内容后才加载JavaScript文件,从而加快了页面内容的展示速度。 总结一下,HTML、CSS和JavaScript的加载顺序问题对于提高网页性能至关重要。合理的加载顺序和资源管理策略可以大大提升用户...

    页面加载顺序,loading巧妙解决

    页面加载顺序对于用户体验至关重要,因为它直接影响到用户首次看到网页内容的速度和形式。在网页开发中,浏览器遵循一定的规则来解析HTML、CSS和JavaScript文件,从而构建出完整的页面。本篇文章将详细探讨页面加载...

    浏览器的加载与页面性能优化

    开发者可以通过在HTML中添加`<link rel="dns-prefetch" href="//HOSTNAME.com">`标签,或者利用HTTP头`X-DNS-Prefetch-Control`来引导浏览器进行DNS预解析,从而进一步加速页面加载。 此外,CDN的合理部署也是提升...

    html加载顺序.zip

    HTML加载顺序是Web前端开发中的一个关键概念,它关乎到网页元素何时呈现、何时执行以及如何交互。了解这个过程对于优化网页性能、提高用户体验至关重要。本文将深入探讨HTML的加载流程,包括解析、渲染和执行的各个...

    html中js代码的加载顺序

    在HTML文档中,JavaScript代码的加载顺序是网页解析过程中至关重要的一部分。这关乎到脚本何时执行、页面元素的渲染以及整个用户体验。理解这一过程对于优化网页性能和编写高效的JavaScript至关重要。 首先,我们要...

    测试浏览器运行速度

    在这个场景中提到的工具就是"测试浏览器运行速度",它专门用于检测浏览器加载网页的具体环节,帮助我们定位性能瓶颈。 "HttpWatch Pro"是一款强大的浏览器性能测试工具,正是标题中提及的解决方案。该软件能够集成...

    浏览器加载、渲染和解析过程黑箱简析

    在理解浏览器加载、渲染和解析过程时,首先我们要知道这是一个复杂且高度优化的过程,涉及到了多个步骤和机制。浏览器的主要任务是将HTML、CSS和JavaScript等资源转化为用户可见的网页。下面我们将详细探讨这些过程...

    页面加载中js 页面加载中js 页面加载中js

    在页面加载时,浏览器会按照HTML文档的顺序解析元素并执行遇到的JavaScript代码。如果JavaScript位于文档的头部,可能会阻塞页面的渲染,直到脚本执行完毕。因此,将脚本放在`<body>`标签底部或使用`async`或`defer`...

    Javascript在页面加载时的执行顺序.pdf

    JavaScript在页面加载时的执行顺序是网页开发中的关键概念,对于理解JavaScript如何与HTML交互至关重要。以下是关于这一主题的详细解释: 首先,我们来看在HTML中嵌入JavaScript的几种常见方式: 1. **内联脚本**...

    Javascript在页面加载时的执行顺序.docx

    JavaScript在页面加载时的执行顺序是网页开发中的核心概念,对于理解JavaScript如何与HTML交互至关重要。以下是对这个主题的详细阐述: 一、JavaScript在HTML中的嵌入方法: 1. **内联方式**:直接在`<script>`和`...

    静态HTML页面加载和解析

    今天给大家分享一篇文章,关于静态HTML页面加载和解析的相关显示流程的。浏览器加载和渲染html的顺序。

    JAVASCRIPT在页面加载时的执行顺序[参考].pdf

    JavaScript 在页面加载时的执行顺序详解 在 HTML 中嵌入 JavaScript 的方法有多种,包括直接在 `<script>` 标记中编写代码、使用 `<script>` 标记的 `src` 属性引入外部 JavaScript 文件、在事件处理程序中编写代码...

    讨论html与javascript在浏览器中的加载顺序问题

    一、html页面的详细加载过程是什么呢?页面元素在加载时的优先级是什么? 二、javascript的作用域、变量的作用域、不同脚本段之间的关系? 三、html页面的生命周期? 这些问题真的打中了我的死穴。不了解这些,我就...

    html中嵌入js执行顺序_html中嵌入js执行顺序_

    1. **同步与异步加载**:默认情况下,`<script>`标签内的脚本和通过`src`引入的脚本都是同步加载的,这意味着浏览器会阻塞页面渲染直至脚本执行完毕。然而,为了提高页面加载速度,可以使用`async`或`defer`属性。 ...

    js在html中的加载执行顺序.docx

    JavaScript作为网页开发中的重要组成部分,在HTML文档中的加载与执行顺序对于理解页面动态行为至关重要。以下是一些基本的原则: 1. **加载顺序**:JavaScript代码在HTML文档中的加载与执行顺序遵循其在文档中的...

    禁止浏览器缓存当前文档内容

    在网页开发中,浏览器缓存机制是为了优化加载速度,但是有时会导致问题,比如服务器端更新的内容无法及时反映到客户端。为了防止这种情况,可以通过设置HTTP响应头来禁止浏览器缓存当前页面。以下是三种常用的响应头...

    Chrome浏览器调试教程

    通过本文的学习,我们不仅了解了Chrome浏览器的基础知识及其下载安装流程,还深入探讨了浏览器加载HTML页面的过程以及如何利用Chrome开发者工具进行高效调试。掌握这些技能对于前端开发人员来说至关重要,能够显著...

Global site tag (gtag.js) - Google Analytics