자바스크립트에서 실시간 디스플레이 업데이트를 강제하는 방법은 무엇입니까?
P粉148434742
2023-09-04 17:44:30
<p>내 웹페이지를 실시간으로 업데이트하는 자바스크립트를 얻으려면 어떻게 해야 하나요?
내 Chrome 브라우저가 모든 처리 작업을 필요한 계산에 넣은 다음 웹페이지를 업데이트하는 것 같습니다. 다음은 가장 간단한 테스트 HTML 파일입니다. 나는 (단순히 최종 값으로 점프하는 것보다) 순차 계산을 보고 싶습니다. <code>display.innerHTML = i;</code>를 무엇으로 바꿔야 하나요? </p>
<p>setInterval 또는 유사한 것을 사용하여 계산을 여러 계산으로 나누는 것이 답이 아니기를 바랍니다. 물론 이것이 생성하는 인터럽트로 인해 디스플레이가 업데이트될 수 있지만 그렇게 자세하게 관리하는 것은 마음에 들지 않습니다... 여기에서 계산이 브라우저가 끝날 때까지 계속되지 않도록 "차단" 디스플레이 기능을 사용할 수 있었으면 좋겠습니다. 디스플레이 업데이트 렌더링(또는 C가 제공하는 것과 같은 "새로 고침" 명령이 있습니까?) 필요한 경우 개발자 콘솔을 사용할 수 있지만 그것도 이상적이지는 않습니다. </p>
<pre class="brush:php;toolbar:false;"><!DOCTYPE html>
<html>
<본문>
<p id="디스플레이"></p>
<스크립트>
const display = document.getElementById("표시");
for (i = 0; i <= 3000000000; i++) {
if (i % 100000000 == 0) display.innerHTML = i }
</스크립트>
</body>
</html></pre></p>
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
requestAnimationFrameWay루프를 종료할 때 requestAnimationFrame 또는 setTimeout을 사용하여 UI가 업데이트되도록 한 다음 중단된 부분부터 루프를 다시 시작하세요.
Web Worker 메서드
알고리즘을 JS 파일에 넣으면 업데이트가 필요할 때 메시지가 게시됩니다
으아악그리고 UI 코드에도 있습니다.
으아악