Bagaimana untuk memperkenalkan js ke dalam bootstrap

Cara memperkenalkan Bootstrap JS termasuk: melalui CDN (bootstrap.bundle.min.js disyorkan);

bootstrap Cara Memperkenalkan Js

Untuk memperkenalkan bootstrap js, terdapat kaedah berikut:

method 1: Gunakan cdn

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

method 2: muat turun dari tempatan

1. muat turun Pustaka Bootstrap.
2. Tambahkan fail bootstrap.js pada projek anda. 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()

🎜Pastikan anda menggunakan versi JStrap yang sepadan dengan versi CSS. 🎜🎜Untuk Bootstrap 5, disyorkan untuk menggunakan bootstrap.bundle.min.js, yang mengandungi semua komponen JavaScript. 🎜🎜Untuk versi Bootstrap yang lebih lama, anda mungkin perlu memperkenalkan fail JS setiap komponen secara berasingan. 🎜🎜🎜🎜Menggunakan komponen JS🎜🎜🎜Selepas memperkenalkan Bootstrap JS, anda boleh menggunakan komponen JavaScriptnya. Contohnya: 🎜
🎜Kotak timbul (Modal): $('#myModal').modal()🎜🎜Halaman tab (Tab): $('#myTabs') . tab()🎜🎜Slider (Carousel): $('#myCarousel').carousel()🎜🎜🎜Lihat dokumentasi Bootstrap untuk mendapatkan maklumat lanjut tentang komponen tertentu. 🎜

Atas ialah kandungan terperinci Bagaimana untuk memperkenalkan js ke dalam bootstrap. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!