维护正确的 CSS \ Javascript 和使用模板引擎 - 矛盾吗？
模板引擎（Velocity、FreeMaker 等）可以让您将 HTML 分割成可重复使用的块。例如，您有一个
#parse('myAd.vm')。我喜欢考虑这些 . vm 文件为函数时，它们会被“调用”（解析）并输出文本内容。它们可以有“参数”——在 Velocity 中，您可以在解析 'myAd 之前 #set( $myParam = 'foo' ) .vm' 文件，并在该文件中使用该变量。
和 Javascript 的正确方法如何适应这一点？
我的问题是：在自己的文件中定义CSS 可以使用
或者，您可以在单独的“myAd.css”文件中定义“myAd.vm”所需的 CSS，并要求使用任何 HTML。解析的文档“myAd.vm”的 head 标记中将包含 。这是一个问题，因为它使事情变得更加复杂和麻烦，并且 - 您可能希望根据条件实际解析“myAd.vm”文件（例如，在 Velocity 中，您可以使用 #if(someCondition) #parse('myAd.vm') #end) - 意味着您实际上并不提前知道 head 标签是否应该链接到该外部 CSS 文件。
有什么想法吗？ 谢谢。
A template engine (Velocity, FreeMaker, etc.) lets you, among other things, split up your HTML into re-usable chunks. E.g. you have a <div> showing an ad that appears on lots of places in your site - you can compose a file containing that <div> and its contents once (with Velocity: a 'myAd.vm' file), and load it up into whatever page necessary (with Velocity: apply #parse('myAd.vm').
I like to think of these .vm files as functions, they get "invoked" (parsed) and spit out textual content. They can have "parameters" - in Velocity you can #set( $myParam = 'foo' ) just before parsing the 'myAd.vm' file, and use that variable inside that file.
My question is: How does the proper way of defining CSS and Javascript in their own files fit in with that?
The 'myAd.vm' needs CSS styling, you can define that CSS in that file itself with a <style> tag - which will result in an HTML document with a style tag in its <body> - not in its <head>, and certainly not in a separate file.
Or, you could define the CSS that 'myAd.vm' needs in a separate 'myAd.css' file, and demand that whatever HTML document that parses 'myAd.vm' will have a <LINK REL="StyleSheet" HREF="myAd.css" TYPE="text/css"> in its head tag. This is a problem since it makes things more complex and cumbersome, and - you may want to actually parse the 'myAd.vm' file depending on a conditional (in Velocity, for example, you could have #if(someCondition) #parse('myAd.vm') #end) - meaning you don't actually know in advance whether the head tag should link to that external CSS file.
Any thoughts?
Thanks.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
我使用的大多数框架都使您能够进行某种函数调用，充当 css 或 js 文件的包含，然后将它们输出到外部文件的头中。在很多情况下，我实际上是通过一个压缩器来运行所有这些，所以最终只有一个 css 和一个 js 文件。
通过这种方式，您可以从视图部分中添加到资源堆栈中，并将内容直接放入头部。
Most frameworks that ive used give you the ability to make some kind of function call that kind of acts as an include for a css or js file, these are then output in the head to external files. In many casses i actually run all these through a minifier so in the end there is only one css and one js file.
This way you can add to the asset stack from within view partials and put stuff directly in the head.
Apache Wicket（基于组件的框架）允许您添加所谓的“标题贡献”（“renderHead”方法现在在 Wicket 1.5 中）通过继承系统作为其页面组合的一部分。这意味着，尽管页面仅定义了要呈现的整个 HTML 的一部分，但它仍然可以向 添加一些内容。整个文档，因此包括将 javascript 和 CSS 文件的标签放在正确的位置。
对于非基于组件的框架，Thymeleaf 模板引擎（可与 Spring MVC 一起使用）作为其“自然模板”功能的结果，允许您通过包含其他页面的片段（在 和 中，这在某种程度上解决了您的问题）来组成页面，而不是“面向继承”的方法对于 Sitemesh 或 Tiles 等组合框架来说是很自然的。
问候，
丹尼尔.
Apache Wicket (a component-based framework) allows you to add what it calls "Header contributions" ("renderHead" method now in Wicket 1.5) as a part of its page composition through inheritance system. This means that, although a page only defines a chunk of the total HTML to be rendered, it can still add something to the <head> of the whole document and therefore include <link> tags for your javascript and CSS files in their correct places.
As for non-component-based frameworks, the Thymeleaf template engine (which can be used with Spring MVC), as a result of its "natural templating" ability, allows you to compose pages by including fragments from other pages (both in <head> and in <body>, which to some extent solves your issue), as opposed to the "inheritance-oriented" approach natural to composition frameworks like Sitemesh or Tiles.
Regards,
Daniel.