是DOM异步还是同步代码?

时间:2018-02-08 21:09:24

标签: javascript asynchronous dom synchronous

最初的问题是:" Vanilla javaScript DOM查询。如何在继续之前确保异步代码已在前端完成?"

但我更改了标题,因此搜索查询会更有用,并显示答案中实际提供的信息。

如果这样的代码是异步的:

let elements = document.querySelectorAll('div');

然后,你如何确保所有的' div'元素已存储到变量“元素”中。在循环之前?

let elements = document.querySelectorAll('div');
//how do you know that all of the elements will 
//have been retrieved in time to run this for loop:
for(let i = 0 ; i < elements.length ; i++) {    
    let div = elements[i];    console.log(div);   
}

2 个答案:

答案 0 :(得分:2)

  

如果这样的代码是异步的

它不是querySelectorAll不是异步函数。

  

你如何确保所有的&#39; div&#39;元素已存储到变量

什么都不做。

您可能需要等待的唯一原因是之前的函数异步向DOM添加内容,在这种情况下您必须等待该函数完成。

答案 1 :(得分:0)

我认为优秀的老师应该找出误解并加以澄清,而不是反省地拒绝初学者的问题。

我以前认为,因为DOM是一个单独的接口(即Vanilla js与浏览器进行交互),所以对其的读写类似于对数据库的读写。而且我的代码中的错误似乎适合这种范例。

实际上,JS脚本是在DOM所处的相同环境中执行的,因此它不是异步的。异步事件是通常发送到另一个环境,然后通过排队进入事件循环返回的事件。

Easy to understand definition of "asynchronous event"?

https://eloquentjavascript.net/11_async.html