将样式表内容复制到剪贴板

Question

你好强大的网络奇才，

问题：

是否可以将指定样式表的内容复制到用户剪贴板？

实施例

1. 用户点击“复制到剪贴板”按钮。
2. 将forms.css的内容复制到他的剪贴板。
3. 用户可以将这些内容粘贴到自己的项目中。

可能的方法：

1. 使用插件：copycss plugin似乎接近我需要的，但只复制指定DOM元素的CSS。我需要整个样式表的css代码。示例：与表单元素相关的所有内容（从forms.css复制）

2. 从DOM复制：另一种方法是将样式表内容插入隐藏文本字段并通过jQuery从那里复制。但我不确定它是否可能以某种方式获取内容并将其插入DOM。

任何想法？

我很感激正确推动。

一切顺利！干杯！

Answer 1

要将样式表作为字符串获取，您可以使用document.styleSheets，并执行类似

的操作

var styleSheet  = document.styleSheets[0],
    styleString = $.map(styleSheet.rules, function(rule) {
        return 'cssText' in rule ? rule.cssText : '';
}).join("\n");

请注意document.styleSheets是一个集合，因此[0]获取页面中的第一个样式表，[1]获取第二个样式表。

至于保存到剪贴板，这可能相当复杂，首选的方法是使用提示，如下所示

window.prompt("Copy to clipboard: Ctrl+C, Enter", styleString);

告诉用户手动复制字符串。

如果您希望使用跨浏览器方式来使用按钮，则必须使用闪存，并且有插件，ZeroClipboard是最常用的，但也有{{3这有点容易使用。

Answer 2

有关将数据复制到剪贴板的方法的概述，请参阅400212。

至于获取CSS;

var styles = document.styleSheets[0].href;
$.get(styles, function(data) {
  console.log(data); // call the clipboard copy function on data here
});