欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

原生JS设置和获取transform样式

程序员文章站 2022-04-28 23:01:13
...

用JS获取transform样式的值

let tabulW = document.querySelector('.tabul')      /* 下面是DOM需要获取的DOM元素*/
let transX = document.defaultView.getComputedStyle(tabulW, null).transform

会返回一个字符串
比如我这里是设置了translateX -200px

// 获取的字符串中就会包含
"matrix(1, 0, 0, 1, -200, 0)"
// 之后获取的时候 我使用的方法是split用,分割成一个数组
transX.split(',')
分割之后通过索引索取
'["matrix(1", " 0", " 0", " 1", " -200", " 0)"]'

用JS设置transform样式的值

设置就是原来的方法了

tabulW.style.transform = 'translateX(-' + 200 + 'px)'