Delayed display of time-consuming operations in JS running

The Code is as follows:
Copy codeThe Code is as follows:
Document. getElementById ("btnConnect"). value = "connected ";
Connect (); // time-consuming operation
Document. getElementById ("btnConnect"). value = "connected ";

During execution, it was found that the button was not changed to the "connection in progress" status, but waited for Connect (); after execution, it was quickly changed to "connection in progress"
It was very depressing for one afternoon. Later, I offered a method and added setTimeout to achieve the desired effect.
The Code is as follows:
Copy codeThe Code is as follows:
Document. getElementById ("btnConnect"). value = "connecting ";
SetTimeout ("Connect ()", 1 );

Then, move document. getElementById ("btnConnect"). value = "connected"; to Connect.