如何在页面中包含 CSS 和 JS - How to include the CSS and JS in pages?

我知道<link type="stylesheet" href=".." />和<script type="text/javascript" src=".." />是如何工作的。但是我有一些真正的理解，它们应该在W3C的上下文中以及在良好的编程实践的上下文中的位置。我有很多例子，这些都在标题中。我不知道为什么，但似乎是合法的。但是，当它们位于 HTML 代码中的其他地方时，它会产生什么影响？

以一个header文件为例，PHP将其包含在网站的所有页面中，并且此头文件具有自己的CSS''JS文件。因此，它们可以包含在头文件本身中，然后在页面的HTML正文（包括头文件）的中间将有一个link和一个script标记。另一种选择是将它们放在每个文件的head部分，但随后必须在每个页面中进行更改。

我的问题：

根据 W3C，link和script标签应该在哪里？
如果它们像上面的例子一样位于 HTML 正文的中间，会产生什么影响？
就良好的编程实践而言，最佳解决方案是什么？
如何在具有符合 W3C 的页面的同时进行以下include，并且以一种在更改 CSS''JS 文件时不必更新每个页面的方式。
- 片段独立于包含页面。

为了清楚起见，举一个简短的例子：（对于JS文件也考虑相同的情况）

标头.html：

   <link rel="stylesheet" href="header.css" />     <!--- Should this be here? --->
<nav>
   <ul>
     <li>Menu item1</li>
     <li>Menu item2</li>
   </ul>
</nav>

索引.php：

<html>
   <head>
      <link rel="stylesheet" href="header.css" />     <!--- Or should it be here? --->
   </head>
   <body>
      <?php include('header.html'); ?>
      <!--- Some HTML code ---->
   </body>
</html>

标头.css：

nav{ color: #00FF00; }

简单

Put Scripts at the Bottom.
Put Stylesheets at the Top

HTML 规范明确指出样式表是包含在页面的标题中："与A不同，[链接]可能只出现在文档的 HEAD 部分，尽管它可能出现任意数量的都不是其他选择，空白的白屏或闪光灯的无风格内容，值得冒险。最佳解决方案是遵循 HTML 规范并在文档标题。

对于javascipts

脚本引起的问题是它们阻止并行下载。HTTP/1.1规范建议浏览器不再下载每个主机名并行的两个组件。如果您提供图片从多个主机名，您可以进行两次以上的下载并行。但是，在下载脚本时，浏览器不会开始任何其他下载，即使是在不同的主机名上。

仅供参考：http://developer.yahoo.com/performance/rules.html#css_tophttp://developer.yahoo.com/performance/rules.html#js_bottom

[编辑]
对于您的新问题，

将该标题.html设置为动态页面。
当包含它时，从输出缓冲区读取数据（假设您不是冲洗掉）使用ob_get_contents。
然后，您可以将css文件注入头部。
呼应它。
用ob_end_clean（）清洁缓冲区;

一些框架，如 zend，允许你用帮助程序来控制它。

样式表应始终位于标题中。根据 W3C 规范，正文中不允许使用样式标记。你应该放在正文中的唯一CSS是内联CSS，尽管我通常避免内联样式。

Head是为（引用W3C）设计的：

"有关当前文档的信息，例如其标题、可能对搜索引擎有用的关键字以及其他不被视为文档内容的数据" 通过： http://www.w3.org/TR/html401/struct/global.html#h-7.4.1

当您需要在用户加载页面之前加载 JS 时，您可以将 JS 放在标头中。GoogleAnalytics或其他服务或UI元素可以加载到正文中。互联网连接速度慢的人会感谢您。您的大小的内容将首先加载，而不是nice2have您网站的元素。

<html>
  <head>
     <link type="stylesheet" href=".." />
     <script type="text/javascript" src=".." />
  </head>
  <body>
     <!-- here html codes -->
  </body>
</html>

您必须在 head 部分中使用链接和脚本标签示例代码：

<html>
    <head>
    <link href="YOUR URL" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" src="YOUR URL"></script>
</head>
<body>
    <!--HTML tags-->
</body>
</html>