如何将一个页面上的块复制到另一个保留css样式的页面？

Question

说我有两个页面的javascript可以通过window.open（）或window.opener的返回值相互通信。页面可以（通常会）具有完全不同的css规则。

我在一个页面的DOM heirachy中选择一个任意节点（比如说，一个DIV元素）。我现在将它的一个克隆插入到另一个文档中，在层次结构中的某个任意（但合法）位置。

现在我还要创建css规则，使其在新页面上保持相似。我更喜欢css规则中最少的属性。

我可以通过对两个文档的DOM元素进行某种样式和计算样式的比较来做到这一点吗？如果我暂时从元素中删除类，或者以其他方式修改它们，它会有所帮助，这样我就可以使用＆＃34;默认＆＃34;来获取元素的计算样式。风格，并与之相比？

Answer 1

http://jsfiddle.net/1ruvsqw1/1/

var e = document.getElementsByClassName('test')[0],
    div = e.cloneNode(true),
    newStyles = getComputedStyle(e);
document.body.appendChild(div);
var existingStyles = getComputedStyle(div);
for (var i in existingStyles) {
    console.log(i, existingStyles[i]);
    if (newStyles[i] != existingStyles[i]) div.style[i] = newStyles[i];
}

只需在for-in循环中复制计算出的样式。