いくらソースコードが書きやすくなっても行うべきでないですし、async, await を使ったコードをトランスパイルする方が良いのですが素の JavaScript で題の通りこのことができます。実際のコードが次です。
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Title</title> <script> document.addEventListener('DOMContentLoaded', function () { // id="timer"要素の中身を 10ms 毎に変化させる const el = document.querySelector('#timer') let i = 0; setInterval(() => el.textContent = String(i++), 10) // 読み込まれて1秒後に動機リクエストを送信 setTimeout(() => { const request = new XMLHttpRequest(); request.open('GET', 'http://localhost:8090', false); // `false` で同期リクエストになる request.send(null); if (request.status === 200) { console.log(request.responseText); } /** * https://developer.mozilla.org/ja/docs/Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests#example_http_synchronous_request * より引用 */ }, 1000) }) </script> </head> <body> <div id="timer"></div> <!-- input 要素に対するキーボード入力もできなくなります --> <input type="text"> <!-- Ctrl+R によるキーボードショートカットの更新もできなくなります --> </body> </html>
同期と非同期のリクエスト – Web API | MDN#例: HTTP 同期リクエスト
そんなことができたのかって感じです。もっとも Firefox では次の様に警告が現れ、実際どのブラウザでも通信中は様々な機能が動かなくなるので大変ユーザーに優しくない挙動です。
ユーザー体験に対して好ましくない影響があるため、メインスレッドでの同期 XMLHttpRequest は推奨されません。詳しくは http://xhr.spec.whatwg.org/ を参照してください。
そういうこともできる、というぐらいで実際のプログラムには持ち込まない方が良いでしょう。