Javascript 减去对象的高度/宽度，使其在随机放置时保持在框中？

我的函数可以工作，但由于轴从左上角的“X”开始，所以角可以从框中开始，但其余部分在我的边界之外

如何减去X的高度和宽度，使整个东西都留在JavaScript框中？蒂亚

putAnXBtn.onclick = function(){
    var theBox = document.getElementById("putAnX");
    var width = theBox.clientWidth;
    var height = theBox.clientHeight;

    var yPosition = Math.random()*height
    var xPosition = Math.random()*width;

    var theXElement = document.getElementById("theX");
    theXElement.innerHTML="X";
    theXElement.style.top = parseInt(yPosition)+'px';
    theXElement.style.left = parseInt(xPosition)+'px';

}

---

为了能够使用“顶部”和“左侧”样式，您需要声明“位置：绝对”或“位置：相对”。你的CSS中有吗？你已经知道如何使用

clientWidth

等获取元素的宽度和高度。现在你所要做的就是从

theXElement

中获取宽度和高度，然后减去是的，

位置：relative

在我的CSS中。这就是您所说的减法吗

var width=theBox.clientWidth-theXElement.clientWidth

。可能不是bc，这对我不起作用。要使用“上”和“左”样式，您需要声明位置：绝对或位置：相对。你的CSS中有吗？你已经知道如何使用

clientWidth

等获取元素的宽度和高度。现在你所要做的就是从

theXElement

中获取宽度和高度，然后减去是的，

位置：relative

在我的CSS中。这就是您所说的减法吗

var width=theBox.clientWidth-theXElement.clientWidth

。可能不是bc，这对我不起作用