在JQuery CSS中使用带有剪辑路径的变量

如何在JQuery CSS中使用带有剪辑路径的变量。我已经记录了变量的结果，它似乎与正在工作的css代码完全相同，正如您在img1上看到的。有什么想法吗

$（文档）.ready（函数（）{
//工作
$（'.img1'）.css（{“剪辑路径”：“多边形（30%0%、100%23%、54%50%、100%100%、70%100%、79%59%、10%84%、52%49%）”））；
//不起作用
var random1=（Math.floor（Math.random（）*100）+1）+“%”，
random2=Math.floor（Math.random（）*100）+1+“%”，
random3=Math.floor（Math.random（）*100）+1+“%”，
random4=Math.floor（Math.random（）*100）+1+“%”，
random5=Math.floor（Math.random（）*100）+1+“%”，
random6=Math.floor（Math.random（）*100）+1+“%”，
random7=Math.floor（Math.random（）*100）+1+“%”，
random8=Math.floor（Math.random（）*100）+1+“%”，
clippi=“剪辑路径”：“多边形（'+random1++'+random2++'，'+'+random3++'+random4++'，'+'+random5++'+random6++'，'+'+random7++'+random8++'，'+'+random1++'+random2++'，'+'+'+random3++'+random4++'，'+'+random5++'+random6++'，'+random7+++random8++”）；
console.log（clippi）
$（'.img2'）.css（{clippi}）；
});
img{
宽度：40%；
}
.img1{
边框：5px纯红；
}
.img2{
边框：5px纯蓝色；
}
发生这种情况是因为您正在向css函数传递字符串而不是对象。我可以通过如下更改css声明来修复您的示例：


$（文档）.ready（函数（）{
//工作
$（'.img1'）.css（{“剪辑路径”：“多边形（30%0%、100%23%、54%50%、100%100%、70%100%、79%59%、10%84%、52%49%）”））；
//不起作用
var random1=（Math.floor（Math.random（）*100）+1）+“%”，
random2=Math.floor（Math.random（）*100）+1+“%”，
random3=Math.floor（Math.random（）*100）+1+“%”，
random4=Math.floor（Math.random（）*100）+1+“%”，
random5=Math.floor（Math.random（）*100）+1+“%”，
random6=Math.floor（Math.random（）*100）+1+“%”，
random7=Math.floor（Math.random（）*100）+1+“%”，
random8=Math.floor（Math.random（）*100）+1+“%”，
clippi=random1+''+random2+，'+''+random3+''+random4+，'+''+random5+''+random6+，'+''+random7+''+random8+，'+''+random1+''+random2+，'+''+random3+''+random4+，'+''+random5+''+random6+，'+''+random7+'+random8；
console.log（clippi）
$（'.img2'）.css（{“剪辑路径”：'polygon（'+clippi+'））}）；
});
img{
宽度：40%；
}
.img1{
边框：5px纯红；
}
.img2{
边框：5px纯蓝色；
}