js新建dom节点添加类，类名被解析但是样式不加载

let fatherDom = document.getElementById("fatherDomId");
let newDom = document.createElement("div");
newDom.style.left = "190px";
newDom.style.top = "190px";
newDom.className = "circle"; //能看到类名解析但是样式没加载

1.Vue组件中样式Style中scoped导致样式局部生效，因为采用scoped每个类渲染后会有一个单独的data-v-xxxx编码格式，防止样式污染，去除即可。

2.使用样式穿透，跳过scoped，这样就不用去除scoped造成全局样式污染。Vue2使用/deep/ className，Vue3使用:deep(className)，此外还有>>>。

3.可能是类的优先级，在子类前加上父类，这里时动态创建的类，所以使用了也没效果。

4.重新创建一个CSS/SCSS样式文件，然后在Vue组件中引用该文件即可，将不生效的样式都放在该样式文件中，不需要再去除scoped和deep。

转载自：vue使用原生js创建元素样式不生效问题及解决_vue.js_脚本之家 侵删