ブートストラップにjsを導入する方法

Bootstrap JS を導入する方法には、CDN 経由 (bootstrap.bundle.min.js を推奨)、ローカルから関連ファイルをダウンロードする、npm 経由でインストールして関連モジュールを導入するなどがあります。

#Bootstrap JS の導入方法

Bootstrap JS を導入するには、以下の方法があります。

方法 1: CDN を使用する

<code class="html"><script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script></code>

方法 2: ローカルからダウンロード

ブートストラップ ライブラリをダウンロードします。
2. bootstrap.js ファイルをプロジェクトに追加します。

方法 3: npm 経由

<code class="shell">npm install bootstrap</code>

次に、コードに次の内容を導入します:

<code class="js">import * as bootstrap from 'bootstrap';</code>

手順:

Bootstrap CSS バージョンと一致する JS バージョンを使用してください。
• Bootstrap 5 の場合は、すべての JavaScript コンポーネントが含まれる
• bootstrap.bundle.min.js を使用することをお勧めします。
Bootstrap の古いバージョンの場合は、各コンポーネントの JS ファイルを個別に導入する必要がある場合があります。

JS コンポーネントの使用

Bootstrap JS を導入した後、その JavaScript コンポーネントを使用できるようになります。例:

ポップアップ ボックス (モーダル):
• $('#myModal').modal()
タブ (タブ):
• $ ('#myTabs').tab()
スライダー (カルーセル):
• $('#myCarousel').carousel()
# #特定のコンポーネントの詳細については、ブートストラップのドキュメントを参照してください。

以上がブートストラップにjsを導入する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。