Есть элемент:
<square class="square" style="transform: translate(54px, 54px);"></square>
У него есть атрибут style, в нем есть стиль transform. Получаю его таким способом:
elem.style.transform
После чего получаю такой результат:
translate(54px, 54px)
Как получить значения в скобках?
Самый простой способ это использовать регулярные выражения, вот так:
let elem = document.querySelector('square.square')
let transform = elem.style.transform
let re = /translate\((.*?)\)/
console.log(transform.match(re)[1])<square class="square" style="transform: translate(54px, 54px);"></square>Я использовал метод match на строку, первым аргументом привёл регулярное выражение. Я обращаюсь к первому индексу, а не к нулевому т.к. в 0'ом хранится сама строка полностью, а уже в первом само значение translate, т.к. как вы можете заметить, оно обёрнуто в скобки (скобки без символа \ сзади).
Стоит учитывать, что подобный код не будет работать с translateX, translateY и translateZ. Также стоит учитывать, что если в transform не будет translate'а, то метод match вернёт null, и код выдаст ошибку: TypeError: transform.match(...) is null.