简体   繁体   English

是否合法的元素出现后 </html> ?

[英]Is it legit for elements to appear after </html>?

Google PageSpeed Insights recommend us to defer loading of secondary stylesheets by placing them after the closing </html> tag. Google PageSpeed Insights建议我们通过在次要</html>标记之后放置辅助样式表来推迟加载辅助样式表。 Code example from that page: 该页面的代码示例:

<html>
  <head>
    <style>
      .blue{color:blue;}
    </style>
    </head>
  <body>
    <div class="blue">
      Hello, world!
    </div>
  </body>
</html>
<link rel="stylesheet" href="deferred_stylesheet.css">

This strikes me as odd, because I would expect Google to recommend standard practices instead of non-standard practices. 这让我感到奇怪,因为我希望Google推荐标准做法而不是非标准做法。

Is the code above legit ? 上面的代码是否合法 Do the HTML5 standards provide consistent rules for browsers to parse these sort of code? HTML5标准是否为浏览器提供了解析这些代码的一致规则?

What problems will we (or our users in fact) encounter if we use the tags as such? 如果我们使用标签, 我们 (或我们的用户实际上)会遇到 什么问题

It isn't correct to put anything outside the HTML tags however all browsers try to sort the mess they get served. 将任何内容放在HTML标记之外是不正确的,但是所有浏览器都试图对它们所服务的混乱进行排序。

Almost all browsers eg Firefox, Google Chrome, Internet Explorer, etc will sort this out for you. 几乎所有浏览器,例如Firefox,谷歌浏览器,Internet Explorer等都会为您排序。 Some self written browsers maybe won't do this. 一些自编的浏览器可能不会这样做。

However you can better write it in between the head tag for performance (because then the browsers don't need to sort out the dirty coding). 但是你最好在head标签之间写一下性能(因为那时浏览器不需要理清脏代码)。

This means users will encounter almost no problems. 这意味着用户几乎不会遇到任何问题。

First, you're missing your <!DOCTYPE html> declaration at the top, which is required for HTML5 documents. 首先,您错过了顶部的<!DOCTYPE html>声明,这是HTML5文档所必需的。

Second, you're also missing a <title> tag in your head. 其次,你脑子里还缺少一个<title>标签。

Finally, no, tags after the closing </html> tag are not allowed. 最后,不允许在结束</html>标记之后使用标记。 If you run your doc through the w3 validator service you'll see: 如果您通过w3验证器服务运行您的文档,您将看到:

Line 14, Column 54: Stray start tag link. 第14行,第54列:杂散开始标记链接。

<link rel="stylesheet" href="deferred_stylesheet.css">

This error is unrecoverable. 此错误无法恢复。

I would expect to face browsers either totally ignoring it or loading it. 我希望面对浏览器完全忽略它或加载它。 Depending on the browser, the version and the platform. 取决于浏览器,版本和平台。 Since you can't be sure it'll work (and since it's non-conforming), you shouldn't do it. 既然你不能确定它是否有效(并且因为它不符合要求),你就不应该这样做。

UPDATE UPDATE

This is non-valid HTML, however user-agents are allowed to parse it and include in the body . 这是无效的HTML,但允许用户代理解析它并包含在正文中 But they are not required to since they can define their own rules for parse errors 但它们不是必需的,因为它们可以为解析错误定义自己的规则

Is this correct or even allowed structure? 这是正确的,甚至是允许的结构吗?
No. It is incorrect to place elements outside the <html> tag. 不。将元素放在<html>标记之外是不正确的。

Oh dear! 噢亲爱的! Will it land me in problems? 它会让我陷入困境吗?
No. Browsers will fix your bad code as best as it can. 不会。浏览器会尽可能地修复您的错误代码。 This is no problem for the browser. 这对浏览器来说没问题。

Should I do it? 我应该这样做吗?
Well ... it's complicated. 嗯......这很复杂。 Short answer is "no, probably not". 简短的回答是“不,可能不是”。 As developers, it is our responsibility to ensure that our code is correct (machines can't be trusted, that will be our downfall!). 作为开发人员,我们有责任确保我们的代码是正确的(机器不可信,这将是我们的垮台!)。 The rules are there for a reason. 规则是有原因的。 On the other hand, as hackers, we can some times break and bend rules, if it makes sense in the situation and you know what the consequenses will be. 另一方面,作为黑客,如果在这种情况下有意义并且您知道后果将会是什么,我们有时会破坏和弯曲规则。

HTML hacking? HTML黑客攻击? What the hell are you talking about? 你他妈在说什么?
Browsers will always try to render the document as best as it can. 浏览器将始终尝试尽可能最好地呈现文档。 Interestingly, you don't even have to give the a <html> tag – the browser will figure it out for you. 有趣的是,您甚至不必提供<html>标签 - 浏览器会为您解决。

Here's an example page – inspect the rendered DOM, and the view source. 这是一个示例页面 - 检查渲染的DOM和视图源。 I've almost not given it anything to work with, and it has kindly created all missing tags. 我几乎没有给它任何工作,它已经创造了所有缺失的标签。 Neat! 整齐! You do need a DOCTYPE declaration and in most cases a <title> tag. 您确实需要DOCTYPE声明,并且在大多数情况下需要<title>标记。

But, I digress ... 但是,我离题了......

So, the browser will definitely render it correctly. 因此,浏览器肯定会正确呈现它。 It is, however, incorrect as per the specs, and the document will not validate (if you care about that). 但是,根据规范,它是不正确的,文档将不会验证(如果你关心的话)。 For the most part, it's a good idea to follow the specs, unless you have a good reason. 在大多数情况下,遵循规范是个好主意,除非你有充分的理由。

Now, I can't see why Google wants you to place it outside the <html> tag. 现在,我看不出为什么Google要你把它放在<html>标签之外。 It sounds strange, however I guess they know what they're doing. 这听起来很奇怪,但我猜他们知道他们在做什么。 My guess is, that they want to make absolutely sure, that the ressource is loaded last. 我的猜测是,他们想要绝对确定,最后加载了资源。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM