html
html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<p id="p">why</p>
<script>
var p=document.querySelector("#p")
</script>
<button onclick="alert(p.style.transform)">alert(p.style.transform)</button><p>I need to get p.style.transform (p is paragraph), but it doesn't see value: alert(p.style.transform) make empty string. But you can see, in css there is rule which is applied on paragraph. How can i get real value of transformation of paragraph?<!--if you have "transform:translate(a,b)" and want to make also rotate(a,b), using p.style.translate+="...", rotation will replace translation</p>--></p>
<button onclick="alert(window.getComputedStyle(p).getPropertyValue('transform'))">getComputedStyle</button><p>getComputedStyle(p) give some result, but it is not conveniently, also it can't help to add something to translation.</p>
</body>
</html>
Enter to Rename, Shift+Enter to Preview
css
css
1
2
3
#p{
transform: translate(100px,0);
}
Enter to Rename, Shift+Enter to Preview
js
js
1
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run