更新DOM vs改变视角

Question

我正在关注https://docs.angularjs.org/guide/scope。

5. $ watch列表检测name属性的变化，并通知插值，进而更新DOM。

6.Angular退出执行上下文，该执行上下文依次退出keydown事件并使用JavaScript执行上下文。

7.The 浏览器使用更新文本重新呈现视图。我有疑问的是之间的differnce

更新DOM 5号线和浏览器重新呈现视图第7行 在此先感谢。

Answer 1

DOM表示浏览器中加载的HTML文档。 JavaScript可以通过DOM操作文档，但这些操作不会立即生效，而只会在完成对DOM进行更改的JavaScript上下文之后生效。

想想这样说：

• JS：嘿HTML文件，我会做一些改变你。
• HTML：好的，继续，联系你的朋友DOM并告诉他你想改变什么。
• JS：好吧，我在上面......
• JS：好的，我做了一些改变，但是，嘿，还有一些我需要改变的东西。
• HTML：好的，继续，我会等到你完成所有事情。
• JS：好，完成所有事情
• HTML：好的，我会问DOM你已经改变了什么并且应用了这些。

考虑以下测试：

var a = document.body.children[0]; 

a.style.color = 'red'; 
for(var i = 0; i < 10000000000; i++) { }; 
a.style.color = 'blue'; 

虽然有指令之间有相当多的时间来改变颜色为红色，一个将其更改为蓝色，你将永远不会看到的颜色变化来红色，因为所有更改将在JS完成后应用。

事实上，颜色确实会变成红色，但只是在这个短时间内变为蓝色之前，浏览器甚至没有时间来呈现变化。或者如果是的话，你不会注意到。

换句话说，DOM操作由浏览器排队。一旦JS上下文完成，队列就会被执行。如果JavaScript在其他任务的2个DOM更改之间花费时间，则会延迟队列执行的开始，然后所有排队的更改将连续执行。

鉴于上述信息，应该清楚，更改DOM与更改HTML文档不是一回事。