So führen Sie js in Bootstrap ein

Die Einführung von Bootstrap JS umfasst: über CDN (bootstrap.bundle.min.js wird empfohlen); das Herunterladen verwandter Dateien von lokal über npm und die Einführung verwandter Module.

Bootstrap So führen Sie JS ein

Um Bootstrap JS einzuführen, gibt es die folgenden Methoden:

Methode 1: CDN verwenden

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

Methode 2: Von lokal herunterladen

1. Herunterladen Bootstrap-Bibliothek.
2. Fügen Sie die Datei bootstrap.js zu Ihrem Projekt hinzu. 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，推荐使用 bootstrap.bundle.min.js，其中包含了所有 JavaScript 组件。
• 对于较旧版本的 Bootstrap，可能需要单独引入每个组件的 JS 文件。

使用 JS 组件

引入 Bootstrap JS 后，你就可以使用其 JavaScript 组件。例如：

• 弹出框（Modals）：$('#myModal').modal()
• 标签页（Tabs）：$('#myTabs').tab()
• 滑动条（Carousel）：$('#myCarousel').carousel()

Methode 3: Über npm

rrreee🎜Dann fügen Sie in Ihren Code ein: 🎜rrreee🎜🎜Anleitung: 🎜🎜

🎜Stellen Sie sicher, dass Sie die JS-Version verwenden, die der Bootstrap-CSS-Version entspricht. 🎜🎜Für Bootstrap 5 wird die Verwendung von bootstrap.bundle.min.js empfohlen, das alle JavaScript-Komponenten enthält. 🎜🎜Bei älteren Versionen von Bootstrap müssen Sie möglicherweise die JS-Dateien jeder Komponente separat einführen. 🎜🎜🎜🎜Verwendung von JS-Komponenten🎜🎜🎜Nach der Einführung von Bootstrap JS können Sie dessen JavaScript-Komponenten verwenden. Zum Beispiel: 🎜
🎜Popup-Box (Modals): $('#myModal').modal()🎜🎜Tab-Seite (Tabs): $('#myTabs') . tab()🎜🎜Slider (Carousel): $('#myCarousel').carousel()🎜🎜🎜Weitere Informationen zu bestimmten Komponenten finden Sie in der Bootstrap-Dokumentation. 🎜

Das obige ist der detaillierte Inhalt vonSo führen Sie js in Bootstrap ein. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!