HTML多头

mon*_*ksy 6 html javascript css cross-browser tiles2


注意:我绝不提倡页面内的多个头


我正在使用Apache Tiles,我有一些包含自己头部的瓷砖.Tiles的结果呈现为具有多个头的HTML页面.

我的问题:

  1. 如何在IE和Chrome中处理生成的页面?[它呈现并显得成功]
  2. 使用APACHE TILES处理/避免多个头[CSS/Javascript]的最佳实践是什么,而不必要求所有页面使用相同的JS和CSS文件.

例如问题二: 假设您有以下页面:主页,个人资料和图库列表.图库列表有花哨的JQuery + YUI + ...以及更多样式.对于大多数用户来说,他们只对主页和配置文件页面感兴趣,所以为什么要加载与Gallery相关的JS和CSS文件来减慢它们的速度.

这是生成的

<html>
    <head>
       <title>The Template's Title</title>
    </head>
    <body>
       <head> <script src="javascriptfile.js"/></head> Tile One Content
       <head> <script src="javascriptfile2.js"/></head> Title Two Content
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

生成的内容在javascriptfile.js和javascriptfile2中运行脚本.我在第一个问题中问的是:是否忽略了额外的头,内容是否考虑?他们是否合并到html/head级别?是否可以在第二个或更晚的头部包含CSS文件?使用更严格的DTD会产生错误吗?

Alo*_*hci 8

好吧,在现代Chrome中,至少可以知道会发生什么.Chrome使用HTML5解析器算法,该算法准确描述了如何处理无效标记.详细信息请访问http://dev.w3.org/html5/spec/tree-construction.html#parsing-main-inbody

会发生什么事在你的例子是,第一个<head><body>被丢弃.然后<script src="javascriptfile.js"/>处理标记,这是一个开始标记,而不是自闭标记,因此后面的所有内容(包括看起来像标记的所有内容)都将成为脚本元素的文本子项.没有显示任何内容,也没有运行脚本.如果 <script src="javascriptfile.js"/>被替换为<script src="javascriptfile.js"></script>,并且ditto for <script src="javascriptfile2.js"/>,则开头和结束标记被静默丢弃,并且不移动脚本元素.显示"Tile One Content Title Two Content"并运行脚本.DTD完全没有区别.

IE有点棘手,因为在IE10之前,它不使用HTML5解析器算法,因此它的确切行为是个谜.但是,粗略的实验似乎表明它具有与上述相同的行为.

虽然一些传统浏览器将只能出现在头部的元素(例如<link>)移到头部,但其他浏览器却不会,并且不能依赖这样的行为.

总而言之,最好避开这种结构.

我不知道Apache Tiles的做法.


Spa*_*rky 6

做一些如此无比无效的事情的目的是什么?为什么你问这个似乎很不清楚.

您不仅应该在页面上只有一个 <head></head>部分,在任何情况下都<head></head>不能嵌套在<body></body>部分内的任何位置.

这种做法完全没有任何意义....

(附注: 某些浏览器在构造DOM时会忽略或移动无效标记,这会破坏您执行此操作的全部目的.)

编辑(根据评论):

对于有兴趣在其中包含<script>标签的人<body>,您可以在此处阅读更多有关具体细节的信息......

是否会在正文中而不是在标题中链接javascript文件会导致问题?

  • 小补充:你可以把<script src ="..."> </ script> INSIDE放在体内,它不需要在<head>里面......其实这是有些人推荐的出于性能原因(参见:http://developer.yahoo.com/performance/rules.html) - 我不确定这是否可以用于CSS,但肯定不推荐! (2认同)