Bootstrapを使用して、Ajaxリクエストでバックエンドデータを取得できます。手順は次のとおりです。AJAXリクエストの初期化。サーバーの応答を聞いてください。リクエストを開き、メソッド（GETなど）とURLを指定します。リクエストを送信します。サーバーの応答（JSONまたはXML）を解析します。 DOM要素を更新します。

Bootstrapを使用してデータを取得する方法

Bootstrapは、インタラクティブでレスポンシブなWebアプリケーションを作成するための人気のあるフロントエンドフレームワークです。 Bootstrapはバックエンドへの接続を直接提供しませんが、Ajax（非同期JavaScriptとXML）リクエストを使用してデータをバックエンドから取得できます。

ステップ：

1。AJAXリクエストを初期化します

XMLHttpRequestオブジェクトを使用してAJAX要求を初期化します。

 <code class="javascript">const request = new XMLHttpRequest();</code>

2。サーバーの応答を聞いてください

onreadystatechangeイベントを使用して、サーバーの応答を聞きます。

 <code class="javascript">request.onreadystatechange = function() { if (this.readyState === 4 && this.status === 200) { // 處理服務(wù)器響應(yīng)} };</code>

3.リクエストを開きます

HTTPリクエストを開き、メソッド（取得や投稿など）とURLを指定します。

 <code class="javascript">request.open("GET", "your-endpoint-url", true);</code>

4。リクエストを送信します

AJAXリクエストを送信します。

 <code class="javascript">request.send();</code>

5。サーバーの応答を解決します

応答を受信したら、JSONまたはXML応答データを解析します。

 <code class="javascript">const data = JSON.parse(request.responseText);</code>

6. DOMを更新します

バックエンドから取得されたデータでDOM要素を更新します。

 <code class="javascript">document.getElementById("result").innerHTML = data.message;</code>

例：

次の例は、Bootstrap Modalを使用してバックエンドからデータを取得および表示する方法を示しています。

 <code class="html"><!-- Modal 內(nèi)容--> <div class="modal-body"> <div id="response-message"></div> </div> <!-- 發(fā)送請求按鈕--> <button type="button" class="btn btn-primary" id="submit-button">發(fā)送請求</button></code>

 <code class="javascript">const modal = new bootstrap.Modal(document.getElementById("modal")); const responseMessage = document.getElementById("response-message"); const submitButton = document.getElementById("submit-button"); submitButton.addEventListener("click", () => { // 初始化AJAX 請求const request = new XMLHttpRequest(); // 監(jiān)聽服務(wù)器響應(yīng)request.onreadystatechange = function() { if (this.readyState === 4 && this.status === 200) { // 解析服務(wù)器響應(yīng)const data = JSON.parse(request.responseText); // 更新DOM responseMessage.innerHTML = data.message; // 顯示Modal modal.toggle(); } }; // 打開請求request.open("GET", "your-endpoint-url", true); // 發(fā)送請求request.send(); });</code>

以上がブートストラップのバックエンドを取得する方法の詳細內(nèi)容です。詳細については、PHP 中國語 Web サイトの他の関連記事を參照してください。