Bootstrap comes with 12 jQuery plug-ins, which expands its functions and can add more interactions to the site. Even if you're not an advanced JavaScript developer, you can start learning Bootstrap's JavaScript plugin. Using the Bootstrap Data API, most plug-ins can be triggered without writing any code.
There are two ways for sites to reference the Bootstrap plug-in: (recommended learning: Bootstrap video tutorial)
Separate reference: Use individual *.js files of Bootstrap. Some plugins and CSS components depend on other plugins. If you reference plugins individually, make sure you understand the dependencies between those plugins first.
Compile (simultaneously) reference: use bootstrap.js or the compressed version of bootstrap.min.js.
不要尝试同时引用这两个文件,因为 bootstrap.js 和 bootstrap.min.js 都包含了所有的插件。
All plugins depend on jQuery. So jQuery must be quoted before the plugin file.
data attribute
You can use all Bootstrap plugins just through the data attribute API without writing a single line of JavaScript code. This is a first-class API in Bootstrap and should be your first choice.
Then again, there may be situations where this feature needs to be turned off. Therefore, we also provide a way to turn off the data attribute API, that is, to unbind the event with the data-api namespace and bound on the document. Just like the following:
$(document).off('.data-api')
If you need to close a specific plug-in, you only need to add the name of the plug-in as the namespace before the data-api namespace, as shown below:
$(document).off('.alert.data-api')
Programmatic API
We provide a pure JavaScript API for all Bootstrap plug-ins. All public APIs support individual or chain calling methods, and return the collection of elements they operate on (note: the calling form is consistent with jQuery). For example:
$(".btn.danger").button("toggle").addClass("fat")
For more technical articles related to Bootstrap, please visit the Bootstrap Tutorial column to learn!
The above is the detailed content of What is bootstrap plugin. For more information, please follow other related articles on the PHP Chinese website!