首先下载哪个文件? CSS或JS

时间:2018-08-23 17:42:10

标签: javascript html css dom browser

<head>
  <script src="/some/path/to/js"></script>
  <link href="/some/path/to/css">
</head>

当我们在<script>标签(对于CSS文件)之前的<head>标签中有一个<link>标签(对于js文件)时。浏览器将首先请求哪个文件?

  1. 会同时请求css和js文件吗?
  2. 在请求CSS文件之前,它首先要等待js文件下载吗?
  3. 或者,它会先下载css,用完整的HTML和CSS渲染页面,然后再请求js文件吗?

Describe the page rendering process in a browser? 这篇文章没有解释js文件的阻止性质以及它如何影响HTML渲染/解析。

2 个答案:

答案 0 :(得分:2)

通常…非<script>defer的{​​{1}}个元素可以async来阻止对HTML文档的进一步解析。 document.write不会在脚本处理之前添加到DOM中,因此在此之前不会下载CSS。

但是,HTTP 2即将到来,这允许服务器启动delivering associated resources,而浏览器没有明确请求它们。

答案 1 :(得分:0)

浏览器从上到下读取,这就是为什么您在各种项目中都在文档末尾看到JS脚本以防止任何错误的原因,因此DOM首先加载。它不会使它同时首先加载脚本。如果打开检查器工具->网络,则可以刷新示例页面,并查看dom如何在文件中加载。