当 JavaScript 仍然是 运行 时,浏览器是否显示 HTML 更改或允许提交表单?

Does browser show HTML changes or allow submitting form while JavaScript is still running?


像这样: <form action="" method="post"><input type="submit" value="Submit"></form>

并且当用户提交它时,某些功能恰好在进行中。

function happens_to_be_running_and_user_clicks_submit(){
    the_form_element.insertBefore(document.createElement('textarea'),the_form_element.firstChild).value='first textarea value';
    the_form_element.insertBefore(document.createElement('textarea'),the_form_element.firstChild).value='second textarea value';
}

(似乎有很多关于回流影响性能的讨论。但我仍然不确定是否存在任何要求或者它可能仅取决于浏览器。特别是关于提交表单,无论它是否有与回流或渲染有关。)

我认为您对示例函数的命名方式可以解释您的困惑 happens_to_be_running_and_user_clicks_submit。我假设您希望当用户单击按钮时函数可能是 运行。

这是不可能的。至少在不使用网络工作者的情况下。即便如此,Web Worker 也无法更改 DOM,因此当 Web Worker 将消息发送回主线程以更改 DOM 时,它又变得不可能了。

Javascript 是单线程的。因此一次只能发生一件事。当用户执行任何操作(移动 window、单击按钮、移动鼠标​​...)时,OS 会将该事件发送到应用程序的事件队列。 Javascript(或者更确切地说,浏览器)读取这个队列来处理事件。但是因为它是单线程的,所以它只在不忙的时候处理事件。

所以。这给我们留下了只有两种可能性。

  1. 您的函数以某种方式在用户单击按钮之前立即执行。然后当用户单击按钮时,函数所做的一切都将呈现并激活。

  2. 您的函数以某种方式在用户单击按钮后立即执行。然后,当用户单击按钮时,该功能将不会被激活。

没有第 3 个状态。要么全有,要么全无。至少不是没有异步的东西,比如 setTimeout 或 ajax.