How to check if Twitter bootstrap is loaded?

How can I check whether there is a bootstrap.js file loaded on a page (the bootstrap.js file itself may be compiled/minified into another, bigger JS file)?

Solution 1:

All you need to do is simply check if a Bootstrap-specific method is available. I'll use modal in this example (works for Bootstrap 2-4):

// Will be true if bootstrap is loaded, false otherwise
var bootstrap_enabled = (typeof $().modal == 'function');

It is not 100% reliable obviously since a modal function can be provided by a different plugin, but nonetheless it will do the job...

You can also check for Bootstrap 3-4 more specifically (works as of 3.1+):

// Will be true if Bootstrap 3-4 is loaded, false if Bootstrap 2 or no Bootstrap
var bootstrap_enabled = (typeof $().emulateTransitionEnd == 'function');

Note that all of these checks require that jQuery is already loaded.

Solution 2:

I would rather check for specific bootstrap plugin since modal or tooltip are very common, so

if(typeof($.fn.popover) != 'undefined'){
 // your stuff here
}

or

 if (typeof $.fn.popover == 'function') { 
   // your stuff here
  }

works in both bootstrap versions

Solution 3:

if (typeof([?])=='undefined') { /*bootstrap is not loaded */}

where [?] would be any object or namespace which is defined inside the JS file itself.

The concept of "including" doesn't exist in javascript.