Javascript 如何克隆样式元素及其cssRules？

我有一个样式标签，带有css属性和函数

我尝试了

Element.cloneNode（tree）

，但它不包含cssRules

//将样式标记添加到头部
var style=document.createElement（“样式”）；
style.id=“style”，
style.type=“text/css”，
document.head.appendChild（样式）；
//插入一些样式表规则
var sheet=style.sheet；
sheet.insertRule（“p{背景色：红色}”，sheet.cssRules.length）；
sheet.insertRule（“p{color:white}”，sheet.cssRules.length）；
控制台日志（样式表）//使用Css规则显示对象
//尝试克隆
var styleClone=style.cloneNode（true）；
log（styleClone.sheet）//显示空

var style=document.createElement（“style”）；
style.id=“style”，
style.type=“text/css”，
document.head.appendChild（样式）；
//创建克隆元素
var clone=document.createElement（“样式”）；
clone.id=“clone”，
clone.type=“text/css”，
document.head.appendChild（克隆）；
//根据需要设置原始样式
style.innerHTML=“p{color:red}”；
//将样式的相同内容复制到克隆中
clone.innerHTML=style.innerHTML
克隆节点只有添加到文档
或
的一部分后才能获得其自己的
工作表
属性（或
CSSStyleSheet
对象）

我们可以给
styleClone
变量它自己的
sheet
插入头部，就像代码为
style
变量所做的那样

这是我得到的

//将样式标记添加到头部
var style=document.createElement（“样式”）；
style.id=“style”，
style.type=“text/css”，
document.head.appendChild（样式）；
//插入一些样式表规则
var sheet=style.sheet；
sheet.insertRule（“p{背景色：红色}”，sheet.cssRules.length）；
sheet.insertRule（“p{color:white}”，sheet.cssRules.length）；
控制台日志（样式表）//使用Css规则显示对象
//尝试克隆
var styleClone=style.cloneNode（true）；
log（styleClone.sheet）//显示空！
//增加
document.head.appendChild（styleClone）；
//从样式变量复制所有规则
对于（var i=0；i
这不起作用，我需要一个带有sheet.cssRules原始元素（样式）的克隆。深度克隆应具有与原始元素相同的属性。我不明白为什么它不包含图纸对象！现在我按照你的建议做了一个循环，谢谢你！