Javascript JS样式的webkit转换不以内联样式显示

在DOM元素样式上设置多个变换属性时，浏览器不会显示所有设置的属性（webkit、ms和常规）-例如：

element.style.tranform = 'rotate(90deg)';
element.style.webkitTranform = 'rotate(90deg)';
element.style.msTranform = 'rotate(90deg)';

将生成以下内联样式属性

这意味着浏览器不会设置所有属性，而是只获取其中一个属性。

这是一个问题，因为为了生成PDF，我们必须按原样将HTML发送到服务器端。因此，我们找到了一种（某种程度上）有效的解决方法——使用
element.setAttribute（'style'，'transform…-webkit-等…）

上面的方法是有效的，但是每次我们都必须重新构造样式属性，并且只有在设置了所有其他属性之后才能应用转换，这一点并不优雅

有人知道如何解决这个问题吗

提前谢谢
 我想您已经找到了解决方法：使用
setAttribute
。这并不漂亮，但如果带有前缀属性，您就不能相信浏览器X中的HTML会在浏览器Y中工作，因为在为
样式
属性的值生成文本时，浏览器X没有理由包含无效（从其角度来看）属性

在解决方案中，您至少需要注意两件事：

在目标浏览器中仔细测试。我认为所有浏览器都会忠实地保留您使用
setAttribute
设置的内容（根据下面的#2），但是…测试：-）

确保在完成
setAttribute
操作后，代码中没有任何内容通过
style
对象设置样式，因为这将使浏览器删除（从其角度看）无效的样式文本。例如，在Chrome、Firefox、Edge和Safari（至少）上，当我设置
fontWeight
时，以下内容会删除无效的
foo:bar
样式：


var-element=document.getElementById（“元素”）；
setAttribute（“style”，“foo:bar”）；
log（“使用样式之前：”，element.getAttribute（“样式”）；
element.style.fontwweight=“bold”；
log（“使用样式之后：”，element.getAttribute（“样式”）