js生成字符串格式的样式如何加到标签中？

Question

const animation1 = (time:number)=>{

let str = `
.animation-enter-1{
    animation:change linear ${time}s forwards
}; 
@keyframes change {
    0% {
        opacity: 1;
        transform: translateX(0px) translateY(0px) rotate(0deg) scaleX(1) scaleY(1) rotateZ(0deg);
        clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);}
    50%{
        opacity: 1;
        transform: translateX(0px) translateY(0px) rotate(0deg) scaleX(1) scaleY(1) rotateZ(0deg);
        clip-path: polygon(0% 100%, 100% 100%, 100% 50%, 0% 50%);}
    100%{
        opacity: 1;
        transform: translateX(0px) translateY(0px) rotate(0deg) scaleX(1) scaleY(1) rotateZ(0deg);
        clip-path: polygon(0% 100%, 100% 100%, 100% 0%, 0% 0%);}
    }
`
return str

}

Answer 1

style不支持@keyframes，直接放到style标签里面，要动态创建参考下面的
参考

动态创建style标签样式_折纸成鸢。的博客-CSDN博客_创建style标签 动态创建style标签样式操作步骤：创建style标签 var stylee=document.createElement(‘style’);给标签添加属性 stylee.type = ‘text/css’;给标签添加id stylee.id = ‘styleId’；设置要添加的字符串 var sHtml = ‘.un-points .un-point-bullet{backgroun... https://blog.csdn.net/qq_26679989/article/details/105531829