在带有变量的JavaScript中使用CSS calc（）

用户NickC询问是否可以使用CSS的calc（）函数在js中设置元素的位置（或类似的样式属性）

例如：

var pad = "calc(1250px - 1000px)";
element.style.paddingLeft = pad;

这在我的网页上显示得很好，但我想在函数中包含一个js变量，如下所示：

var pad = "calc("+ width +"- 1000px)";
alert(pad); //displays calc( 1250px - 1000px)
element.style.paddingLeft = pad;

我加入了alert语句，以确保字符串本身是正确的，这似乎是正确的。但是，不显示所需的填充

---

我正在做的事情是否有问题，或者根本不可能做到这一点？

您遇到的问题是缺少

字符的简单问题。没有它，就没有填充物，有了它就有了填充物

var宽度='100px'
var element1=document.getElementById（“test1”）
var element2=document.getElementById（“test2”）
var pad1=“计算（“+width+”-90px）”//你有什么
var pad2=“计算（“+width+”-90px）”//应该是什么
element1.style.paddingLeft=pad1；
element2.style.paddingLeft=pad2
div{
背景颜色：红色
}

你好1
你好2
你好，d

这也应该起作用。
只要最后得到的字符串是有效的
calc（）
表达式，浏览器就不可能分辨出它们之间的区别。你确定
width
的值包含“px”后缀吗？当它是一个简单的px减法时，为什么要使用calc？@Pointy，只要
警报（pad）
行没有欺骗我，那么是的，我确定@我知道我能做到，但我觉得奇怪的是，我尝试的方式没有奏效。它不起作用，因为警报中的不是你所拥有的…；）啊哈！太好了，这就把它修好了！我不知道这有什么不同，万分感谢！那么CSS
calc（）
解析器不会将连字符视为标记吗？（？！？）@pointy-CSS
calc（）
[令人烦恼/困惑地]需要在所有运算符之间留一个空格（
+\*-
）@RichWerden我想当你将一个外来语法塞进现有语法时就会发生这种情况：）遗憾的是，我犯了这个错误并不止一次地创建了这个bug。
var pad = `calc(${width} - 90px)`