如何用javascript中的随机数减去div的宽度？

Question

我有一个宽度为200px的div，并且我希望此div的宽度减小javascript中随机数的值。

像这样：

document.getElementById("myGreenHpBar").style.width-randomized number

我该怎么写呢？

Answer 1

这应该工作：

var width = document.getElementById("myGreenHpBar").style.width;
var new_width = width - random_number;
document.getElementById("myGreenHpBar").style.width = new_width;

Answer 2

这应该工作：

var div = document.getElementById("div");

div.style.width = "300px";  

function rand(){
    var randNum = Math.floor(Math.random() * 40) + 1;
    div.style.width = subPx(div.style.width, randNum) + "px";
    alert(randNum);
}

// Gets : "200px", "50"; Returns 200 - 50
function subPx(a, b){
  return parseInt(a, 10) - b;
}

演示

subPx说明

1. 第一次单击按钮时，它将分别收到300px （div元素的原始宽度）和randNum （假设10 ）作为a和b 。
2. parseInt方法将300px转换为以10为底的整数300 （第二个参数）。
3. 从300减去10 （ b ），得到290 。
4. 返回290 。
5. 现在在rand函数中，表达式变为： div.style.width = 290 + "px"
6. 由于"px"是字符串，因此整数290被强制转换为字符串"290"并且结果如下： div.style.width = "290px";

希望有帮助！