4

有没有办法获取 CSS 文件的原始内容？

假设我想从 CSS 文件中获取任何特定于供应商的 css 属性。我需要以某种方式获取 CSS 内容并相应地解析它们。或者我可以只使用 DOM 来访问 CSS 文件的规则。

问题在于，在使用 DOM 时，大多数浏览器（<= IE8 除外）倾向于去除与其浏览器引擎无关的所有自定义属性（webkit 去除 -moz 和 -o 和 -ms） . 因此无法获取 CSS 内容。

如果我使用 AJAX 来获取 CSS 文件的内容，那么如果该 CSS 文件托管在另一个域上，那么相同的源策略将会中断并且无法获取 CSS 内容。

如果要使用跨域 AJAX 方法，那么只有 JSONP 解决方案不起作用，因为我们不解析任何 javascript 代码（因此没有回调）。

有没有其他方法来获取内容？

4

3 回答 3

1

如果 CSS 文件与您运行脚本的页面位于同一域中，则可以使用 AJAX 拉入 CSS 文件：

$.get("/path/to/the.css", function(data) {/* ... */});

如果没有，您可以尝试使用 Yahoo! 管道作为代理并使用 JSONp 获取 CSS。

至于解析，你可以查看Sizzle来解析选择器。您还可以使用 CSS 语法（发布在 CSS 标准中）来使用 JS lex/yacc 解析器来解析文档。我会让你发挥创意。

祝你好运！

于 2010-07-12T22:22:48.667 回答
0

不，你几乎已经涵盖了它。styleIE 以外的浏览器会从/currentStyle对象和document.styleSheets界面中的对象模型中去除未知规则。（当然，您要修补的通常是 IE6-7 的 CSS。）

如果您想从外部域中获取样式表，则需要代理辅助 AJAX。并且从其中解析 CSS 将是一项令人讨厌的工作，尤其是当您需要复制浏览器的怪癖时。我会极力避免任何这样的事情！

于 2010-07-12T22:18:44.020 回答
0

JSONP 仍然是一个有效的解决方案，尽管它会有点伤眼睛。基本上，除了回调填充之外，您还必须添加一个 JSON 属性“填充”并将 CSS 作为值传递。例如，调用脚本http://myserver.com/file2jsonp/?jsonp=myCallback&textwrapper=cssContents可能会返回：

myCallback("cssContents":"body{text-decoration:blink;}\nb{text-size:10em;}");

You'd have to text-encode all line breaks and wrap the contents of the CSS file in quotes (after encoding any existing quotes). I had to resort to doing this with a Twitter XML feed. It felt like such a horrible idea when I built it, but it did its job.

于 2010-07-12T22:38:58.407 回答