Question

我有一个div，其中有一个不断变化的数字。例如：

<div id="current">124</div>

然后我有一个JavaScript函数从这个字段中获取数据并将其存储到JavaScript变量中。因为数字不断变化，我会延迟代码并将NEW数字（在五秒之后）存储到另一个变量中。

但是，当我查看存储在两个变量中的数据时，它们完全相同（当div中的数字发生变化时）。如何更改我的代码以将div的内容存储在一个变量中，并将内容再次（但五秒钟后）存储在另一个变量中？

var before = document.getElementById('current').innerHTML;
setTimeout(function(){}, 5000);
var after = document.getElementById('current').innerHTML;

Answer 1

这应该可以解决问题：

var after;
var before = document.getElementById('current').innerHTML;

setTimeout(function(){
   after = document.getElementById('current').innerHTML;
}, 5000);

为什么会这样？

您对setTimeout的使用（几乎）没有。您的代码一步一步：

指定before
将空匿名回调设置为在5000ms
assing after
5000毫秒后执行匿名回调，完全不执行任何操作

建议的代码一步一步;

创建after
assing before 3设置在5000ms后执行的匿名功能
执行回调函数5000毫秒后，将after从外部范围分配给document.getElementById('current').innerHTML

小提琴：

http://jsfiddle.net/marionebl/bE5Jd/1/

您可能应该阅读closures and callbacks。

Answer 2

setTimeout并不意味着“延迟代码”。

试试这个：

var before = document.getElementById('current').innerHTML, after;
setTimeout(function(){
    after = document.getElementById('current').innerHTML;
}, 5000);

Answer 3

setTimeout函数将创建一个执行传递函数的新“线程”，然后继续使用当前的“线程”（在引号中，因为它们不是真正的线程，但结果类似于线程）。

这意味着在before和after的分配之间没有经过5秒。试试这个：

var after, before = document.getElementById('current').innerHTML;
setTimeout(function(){
  after = document.getElementById('current').innerHTML;
}, 5000);

Javascript将数据存储到来自同一div的变量中

3 个答案: