Is ordering of <link rel=“stylesheet” …> and-第2页回答

Is ordering of <link rel=“stylesheet” …> and

2020-03-11 14:12发布

(I apologize if this is an extremely basic question. I'm a bit of an HTML noob.)

In HTML5, is the relative ordering within the <head> element, of elements having the form <link rel="stylesheet" type="text/css" ...> and elements having the form <script ...></script> at all significant, either semantically or performance-wise (or in some other way)?

For example, assuming a (possibly mythical) "fully HTML5-compliant browser", are there situations in which the following two snippets would produce "different results" (i.e., different appearance, or noticeable different performance, or different behavior, etc.)?

<!DOCTYPE html>
<html>
  <head>
    <!-- ... -->
    <link rel="stylesheet" type="text/css" href="foo.css"/>
    <script src="foo.js"></script>
    <!-- ... -->
  </head>
  <!-- ... -->
</html>

<!DOCTYPE html>
<html>
  <head>
    <!-- ... -->
    <script src="foo.js"></script>
    <link rel="stylesheet" type="text/css" href="foo.css"/>
    <!-- ... -->
  </head>
  <!-- ... -->
</html>

( denotes code that is both correct and common to both cases. IOW, the only difference between the two cases is the ordering of the <link...> and <script>...</script> elements within the <head>...</head> element.)

标签： javascript css html

7条回答

霸刀☆藐视天下

2楼-- · 2020-03-11 14:54

for performance, CSS first then JS...(but JS yields best performance at the end of the markup as noted in some of the other answers)

stylesheets should always be specified in the head of a document for better performance, it's important, where possible, that any external JS files that must be included in the head (such as those that write to the document) follow the stylesheets, to prevent delays in download time.

quote from Optimize the order of styles and scripts (from Google's "Make the Web Faster" Best Practices docs)

0人赞添加讨论(0) 举报