Javascript 将所有样式从一个图元复制到另一个图元

如何从元素A到元素B获得每个样式（甚至是继承的）？在javascript中或使用jquery

---

让我们告诉你，我有一个元素

…

，我添加了一个新元素

，除了内容之外，看起来都一样。

尝试复制每个CSS属性，如下所示：

$（“#目标”）.css（“边框”）、$（“#源”）.css（“边框”）；
$（“#target”）.css（“background”），$（“#source”）.css（“background”）
#来源{
背景色：#dfeacb！重要；
颜色：#bbae4e！重要；
边框：1px纯绿！重要；
}

你好，世界！
你好，世界如果你不关心IE，那么你可以这样做：


var p=document.getElementById（“您的id”）；
var div=document.createElement（“div”）；
div.innerHTML=“您的div内容”；
div.style.cssText=document.defaultView.getComputedStyle（p，“”）.cssText
#您的身份证{
颜色：#123124；
背景色：#decbda；
}
你好，世界实际上，在firefox上无法运行，因为
getComputedStyle（p，”）。cssText
将返回一个空字符串，这是一个长期存在的已知错误：

同时支持Firefox的解决方案是迭代
getComputedStyle
属性并手动创建CSS字符串：

var clonedNode = document.createElement("div");
const styles = window.getComputedStyle(node);
if (styles.cssText !== '') {
    clonedNode.style.cssText = styles.cssText;
} else {
    const cssText = Object.values(styles).reduce(
        (css, propertyName) =>
            `${css}${propertyName}:${styles.getPropertyValue(
                propertyName
            )};`
    );

    clonedNode.style.cssText = cssText
}

如果在内，它将自动继承CSS..（但是没有人会在内放置a，是吗？-因为每个人都验证他们的代码，所以他们会发现错误；-）您可以对新元素使用
addClass（）
。像这样做一次可能没问题，但在循环中，这确实不明智。由于您将每个属性分开抓取，并将其设置为分开。如果元素已经是文档的一部分，这将特别缓慢。您可能还需要添加类似的内容：someElement.appendChild（div）；为什么不使用
window.getComputedStyle
而不是
document.defaultView
，后者指向相同的东西？全局窗口变量的使用更为常见。您可以制作一个测试用例吗？它对我毫无用处（FF 33.1）。也许我希望它做一些它没有做的事情？根据：在许多在线代码示例中，getComputedStyle是从document.defaultView对象中使用的。几乎在所有情况下，这都是不必要的，因为getComputedStyle也存在于窗口对象上。defaultView模式很可能是（1）不想为Windows编写规范的人和（2）制作在Java中也可用的API的组合。但是，只有一种情况必须使用defaultView的方法：当使用Firefox 3.6访问框架样式时。
Object.values（styles）
在Firefox（78.0.2）上返回353个元素的数组，在Chrome（84.0.4147.125）上返回833个元素，在Safari（13.1.2）上返回923个元素
Array.from（style）
分别在Firefox、Chrome和Safari上返回353、317和491个元素，因此我建议更改为
Array.from
。