如何将当前页面样式表作为字符串获取？答案

【问题标题】：How do I get my current page stylesheet as a string?如何将当前页面样式表作为字符串获取？
【发布时间】：2016-02-01 20:46:45
【问题描述】：

假设我当前的页面如下所示：

<html>
    <head>
      <style>
         /* I want to get all this as a string.. AS IS */
      </style>
    </head>
    <body>
       <script>
       function getEntireStyleAsString()
       {
              var str = "";
             /// .... what should be in here?
             return str;
       } 
       </script>
    </body>

</html>

我想要一个简单的函数，它将我的整个页面样式作为字符串返回。使用 jquery 很好。我已经研究了一段时间，但找不到答案。

【问题讨论】：

您的所有样式是否都在<head> 中的<style> 标记中？
其他style标签呢？引用的样式表？内联样式？非 CSS 样式标签/属性？等等？

标签： javascript jquery html css

【解决方案1】：

如果您只想要页面上的第一个样式表，您可以使用以下内容：

var ele = document.getElementsByTagName('style')[0].innerHTML;

但是，这只会获取第一个样式标签内的代码。

【讨论】：

有趣的是，当里面没有 html 时它被称为 innerhtml

【解决方案2】：

如果允许使用 jQuery，你可以这样写：

 var styles = $('style');

它提供了文档上所有样式的 jQuery 选择。从这里，您可以执行以下操作：

styles.text();

把它全部作为一个字符串。祝你好运！

【讨论】：

【解决方案3】：

您可以使用 Peter Rasmussen 提供的答案。但是如果你的<head> 部分中有多个<style> 标签，你最好用它来拉取所有样式：

var sts = document.getElementsByTagName('style');
var str = '';
for(i = 0; i < sts.length; i++){
    str = str + sts[i].innerHTML;
}
document.write(str);

【讨论】：

【解决方案4】：

知道了，没关系。

<style id='test'>
</style>

$('#test').text()

【讨论】：