Question

假设我有以下DIV：

<div id=div5><span id="name">Hertog-Jan</span><span id="price"></span></div><br>

它有两个部分＆＃39;第一个是名称（绝不应该改变），第二个是价格。最后，我必须使用API从荷兰商店＆＃39; Albert Heijn＆＃39;的网站上检索Hertog-Jan的实际价格，但是为了知道，我使用随机数生成器生成一个随机数100和999，并使＆＃39;价格＆＃39;：

<script>
  function price (it) {
    var value = (Math.round(((Math.random() * 900) + 100)));
    /* value *= 0.01; */
    document.getElementById(it).innerHTML.price += ": €" + value;
  }

（也许不是最好的）然后像这样调用函数

price('div5');

然而，输出将始终是Hertog-Jan（没有价格出现）。难道我做错了什么？我个人认为它与innerHMTL.price有关，但我不确定。我曾经有过

<div id=div5>Hertog-Jan</div><br>

但后来我必须添加一个按名称，价格等排序的选项，所以我认为将名称和价格信息放在两个单独的，嗯，＆＃39;框中是有用的。（你明白了）。

有些人可能已经注意到价值* = 0.01现在基本上被关闭了，这是因为有时，如果一个数字（例如626）乘以0.01，那么不给我6.26，而是6.260000000001。有没有什么办法解决这一问题？我希望1到10之间的随机数（包括1，不包括10）四舍五入到正好两位小数（当然它应该总是两位小数）。

Answer 1

尝试使用

document.getElementById(it).innerHTML += ": €" + value;

您不需要将ID名称放在属性的末尾，因为.price不是.innerHTML的属性

Answer 2

如果花一些时间用原始的Javscript来修复你的代码（我习惯一直使用jquery）。

https://jsfiddle.net/7omqk3qs/

function price (it) {
   var elem = document.querySelector('#'+it+' .price');
   var value = (Math.round(((Math.random() * 900) + 100)));
   console.log(value+' ->random Number');
   /* value *= 0.01; */
   var oldValue = parseInt(elem.innerHTML);

  elem.innerHTML = oldValue + value +' €';
}

忽略＆＃34; console.log＆＃34;它用于调试。

这样做：首先你需要解析一个id名称。在此示例中为div5。然后，它会搜索包含class=price的元素（请参阅：querySelector(...' .price')）。

然后随机数（无论你需要什么：D）

接下来它用parseInt()获取旧值，所以你不会得到一个字符串

最后，它将price-<span>的HTML内容更改为oldValue = value。

检查jsFiddle以获取更多信息

希望我能帮到你

改变DIV的内容：不同的跨度部分

2 个答案: