2

我正在尝试生成 HTML 文档的字符串表示形式，以便可以将其发送到另一个服务，该服务将生成当前文档的克隆版本以用于打印目的。

原始 HTML 文档需要使用 Javascript 添加一些样式：

// create the style node
var $style = $("<style type='text/css' rel='stylesheet' />").appendTo($("head"));

// create the style rule
var rules = [];
rules.push(".bluecolor {  }");
if ($style[0].styleSheet) { // IE
    $style[0].styleSheet.cssText = rules.join(" ");
} else {
    $style[0].appendChild(document.createTextNode(rules.join(" ")));
}

// later on in the code...

// set the style rule's color to blue
var sheets = document.styleSheets;
for (var i = 0; i < sheets.length; i++) {
    if ((sheets[i].ownerNode || sheets[i].owningElement) == $style[0]) {
        var stylesheet = sheets[i];
        var cssRules =  (stylesheet.cssRules || stylesheet.rules);
        for (var i = 0; i < cssRules.length; i++) {
            if (matches = /\.bluecolor/.exec(cssRules[i].selectorText)) {
                cssRules[i].style.color = "blue";
                cssRules[i].style.width = "10px";
            }
        }
        break;
    }
}

但是，当我去克隆对象时，克隆的版本在 bluecolor 样式规则中没有 color:blue 或 width: 10px 属性：

var clonedDocument = document.getElementsByTagName('html')[0].cloneNode(true);

我认为这与通过 Javascript 修改规则时原始文档上的样式节点在 Chrome/Firefox 中没有更新这一事实有关。但在 IE 中并非如此。（这是 Chrome 错误吗？）这是演示该问题的示例代码：http: //jsfiddle.net/T4aCC/29/

我的最终目标是生成原始文档的字符串表示形式（在 Chrome 中）。但是，我无法通过 cloneNode 执行此操作和/或我通过 Javascript 更新 CSS 样式的方式不正确。有什么建议么？

4

0 回答 0