Javascript 添加div元素'；s宽度

我有一个div元素和两个按钮，一个增加另一个减少，所以我想要的是，一旦我点击其中一个按钮，我想要它增加或减少

<button class = "increase">increase</button>
<button class = "decrease">decrease</button>
<div class = "expand"></div>
<script>
let increase = document.querySelector(".increase");


let div = document.querySelector(".expand")

let decrease = document.querySelector(".decrease");


increase.addEventListener("click",function(e){
let add = 10;
let getWidth = window.getComputedStyle(div).width;

if(window.getComputedStyle(div).width === "1px"){
div.style.width+=parseInt(getWidth)+add+"px"
}


})

</script>

增加
减少

parseInt（getWidth）+add+“px”

不会做任何计算。它只会连接所有单个值。您必须将这些数字组合在一起，首先进行数学运算，然后在得到结果后进行连接

您还必须在

div

中包含一些内容，使其初始

height

不为零，或者通过CSS为其指定

height

这比你想象的要简单得多。请参阅内联注释：

let increase=document.querySelector（“.increase”）；
让减少=document.querySelector（“减少”）；
让div=document.querySelector（“.expand”）
设amt=10；
增加.addEventListener（“单击”，更改宽度）；
减少.添加的列表（“单击”，更改宽度）；
函数更改宽度（e）{
//根据数据操作HTML属性确定+或-值
//如果是+我们将添加金额，如果不是，则金额变为-amt
changeAmt=this.dataset.operation==“+”？金额：-金额；
//首先用parseInt去掉“px”
让currentWidth=parseInt（getComputedStyle（div）.width）；
//先做数学运算，然后进行连接
div.style.width=（当前宽度+变更金额）+“px”
}

展开{边框：1px纯黑色；高度：1em；}

增加
减少

我跳过它，因为很明显我的IDE中有它。好的，我做了检查。

console.log（getWidth）

在设置它的值并查看它是什么之后。@JuniorDevSchl48不客气。不要忘记向上投票，并点击答案左上角的复选标记将其标记为“答案”。