HTML正文中的样式和脚本标签......为什么不呢？

时间：2009-09-01 11:46:58

标签： html syntax

[这与this question有关，但不是因为它与电子邮件无关。]

在许多情况下 - 尤其是在使用CMS或其他人的框架时，在<style>中嵌入<script>代码和<body>代码比在{{1}中更容易}}。这似乎适用于IE6，IE7（Windows），Firefox 3.x和Safari（OS X）。

严格来说，这是错的吗？如果是的话，它可能导致什么负面后果......除了在一些客户中被完全忽略之外？

注意：很高兴每个人都想谈论DRY和集中风格。想象一下我想在文档中使用样式标签，因为它们不是全球性的，并且我不能在每页基础上访问头部。无论出于何种原因，无论是网站的页面差异，还是每个段落的差异或其他原因。我对跟踪和改变很难感兴趣。我担心在体内使用风格可能带来的后果。

你集中了那些重要的东西。其他一切都在中央样式表中膨胀。

7 个答案:

答案 0 :(得分：26)

尽管在body标签中不允许明确说明状态样式标签，但规格并不重要。每个主要浏览器都支持样式标签，这最终是用户看到您网站的方式。*虽然长期以来一直在推动浏览器行业提供更好的标准和标准支持，但长期以来一直都在推动文件以及可以。

领导HTML5规范工作的Google同时维护google.com违反规范以节省字节，将引号排除在其属性值之外，使用针对CSS规范的选择器黑客，包括没有类型或语言的脚本标记，并链接标签没有类型。一个纯粹主义者可能会争辩说，互联网上最常用的网站之一违反了规范，并且存在被误导的严重危险。或者，我们可以推断，没有浏览器会进入流行使用，无法在规范中呈现如此广泛使用的黑客。

因此，问题更多的是浏览器行业的发展方向 - 这也是更好的规范之一，但也尽力遵守违反这些规范的网页的意图。我敢打赌，样式标签将在未来很长一段时间内保持在体内。

*在撰写本文时，Firefox 3 +，IE6 +，Safari 2 +，Chrome 12+中的HTML5文档类型支持正文中的样式标记。支持可能会更进一步，但这些浏览器很少见于互联网上。

答案 1 :(得分：15)

可以使用<script>和<style>标记的上下文取决于您使用的doctype。例如，我假设你使用的是HTML5 doctype：

<!DOCTYPE html>

script tag在HTML5文档类型下有三个上下文：

  1. 预计会metadata content。
  2. 预计会phrasing content。
  3. 预计会script-supporting elements。

    4. {* 3}}在HTML5 doctype下的上下文结构稍微复杂一些：

    1. 如果style tag不存在：预计会scoped attribute。
    2. 如果metadata content不存在：scoped attribute元素是noscript元素的子元素。
    3. 如果head存在：期望scoped attribute，但在元素间空格和样式元素之外的任何其他流内容之前，而不是内容模型为的元素的子元素透明的。

      4. 基本上，这表明您可以将样式标记和脚本标记放在正文中，因为正文是我们放置流内容和表达内容的地方。

      与往常一样，请参阅您正在使用的doctype的规范。

答案 2 :(得分：9)

答案简短：

详细答案：

STYLE 定义为head.misc：

<!ENTITY % head.misc "SCRIPT|STYLE|META|LINK|OBJECT" -- repeatable head elements -->

head.misc 的元素只允许是HEAD元素的子元素。因此，STYLE只能是HEAD元素的子级。

SCRIPT 定义在 head.misc 和special中：

<!ENTITY % special
   "A | IMG | OBJECT | BR | SCRIPT | MAP | Q | SUB | SUP | SPAN | BDO">

special 定义为inline：

<!ENTITY % inline "#PCDATA | %fontstyle; | %phrase; | %special; | %formctrl;">

此外，SCRIPT也可以是BODY元素的子代。因此，只要 inline 允许SCRIPT元素，就允许HEAD。

答案 3 :(得分：3)

身体风格的两个可能答案：

  1. 使用内联样式。没错，你将失去内部和外部样式的优点，但如果你没有标题的访问权限，那么你就无法访问标题。

  2. 在样式元素中使用scoped属性。这是HTML5的新功能，但其目的是将CSS的范围限制为页面的一部分，例如限制为单个div。坏消息是它尚未得到支持（截至2011年7月），也不向后兼容。但是（据称）有一个JQuery插件可以提供帮助。欲了解更多信息：

答案 4 :(得分：2)

嗯，您有将样式和脚本直接嵌入到内容中的问题。这里的主要口头禅是DRY（不要重复自己）原则。您可以在多个位置使用脚本或特定样式。当该样式或脚本需要修改时，您现在可以对该代码所在的所有位置进行清道夫搜索。保持您的风格和脚本在一个共同的位置是理想的。

另一方面，如果它是一个次要的样式问题（像素推动或只与那个视图相关的东西），它可能没问题。

答案 5 :(得分：1)

但为什么你身上会有style个标签？风格是全球性的，所以我找不到任何合理的理由。

为了简化和分离更多内容，您也应该使用外部样式表。

脚本是允许的，并且有一个原因：它们可能提供输出，它们应该在特定时间和其他原因运行。

答案 6 :(得分：0)

在我看来，最大的问题是便利性。如果要更改页面的样式，如果所有样式和脚本信息都在一个区域中，则更容易。样式/脚本信息可能位于<style>节点，节点的style属性（即<body style='...'>）或外部文件（即<link rel='stylesheet' type='text/css' href='style.css' />）中。使用一致的位置比尝试搜索可能出现样式的所有位置要容易得多。

同样值得注意的是，“除了在一些客户中被完全忽略”之外，类似于“除了从后面击中它时爆炸”或“除了飞行偏离航线并降落在平民区”之外。这是一个严重的问题本身就值得使用标准做法。

相关问题
最新问题