Question

我们可以将css和javascript结合成一个吗？我想为sIFR做这个。因为sifr有.js和.css文件，没有启用js，不使用任何文件css或js。

我想将所有与sIFR相关的文件合并到一个组合的javascript文件中。

所以最后我只有2个文件

font.swf
sifr3.js（其中包含所有内容）

这是最新的sIFR 3 http://dev.novemberborn.net/sifr3/nightlies/sifr3-r436.zip

Answer 1

是的，你可以。如果您使用CSS注释（＆lt;！ - - ＆gt;）注释掉您的JavaScript代码并使用Javascript注释（/ * * /）注释CSS，则可以在同一文件中包含CSS和JS。您必须在页面上包含两次文件，一次作为JavaScript，一次作为CSS 当您将文件包含为javascript时，JS引擎将忽略CSS注释并处理JS代码就好了，而另一种方式是CSS。这是描述该过程的文章的link。

Answer 2

或者，您可以完全摆脱sIFR并使用css @ font-face。

这是一个@ font-face生成器，可以将您的字体转换为不同浏览器（IE和Chrome）的不同格式，如果您不需要整个字符集，甚至可以创建字体的子集。

http://www.fontsquirrel.com/fontface/generator

它适用于所有浏览器，如本文所述：http：// paulirish .com / 2009 / bulletproof-font-face-implementation-syntax /，如本测试页中所示：http：// dl.dropbox .com /u/39519/webfontsdemo/index.html。

我在Windows XP上测试过IE5.5 6 7 8，FF3.6，Chrome 4.0.249.89和Safari 4.0.4。

（对于这些链接感到抱歉，在获得更高声誉之前，我不会发布多个帖子。）

Answer 3

您可以将CSS放入Javascript字符串中，然后在Javascript中创建STYLE元素。

例如:(使用jQuery）

$('<style type="text/css">p { color:red; }</style>').appendTo($('head'));

对于sIFR3，你会写

$('<style type="text/css">@media screen {.sIFR-flash { visibility: visible !important; margin: 0; padding: 0;}.sIFR-replaced, .sIFR-ignore { visibility: visible !important;}.sIFR-alternate { position: absolute; left: 0; top: 0; width: 0; height: 0; display: block; overflow: hidden;}.sIFR-replaced div.sIFR-fixfocus { margin: 0pt;  padding: 0pt;  overflow: auto;  letter-spacing: 0px;  float: none;}}@media print {.sIFR-flash { display : none !important; height: 0; width: 0; position: absolute; overflow: hidden;}.sIFR-alternate { visibility : visible !important; display : block!important; position: static!important; left : auto !important; top: auto !important; width: auto !important; height: auto !important;}}</style>').appendTo($('head'));

（获取CSS文件，删除注释，并删除所有双空格和所有换行符）

Answer 4

您可以将它们保存为单独的文件，并让Javascript将css写入页面。然后只有在启用了javascript时才会显示CSS。

Answer 5

您可以使用smartoptimizer或php speedy之类的内容。

我们可以将css和javascript合并到一个javascript文件中吗？

5 个答案: