Как я могу проверить, загружен ли на страницу bootstrap.js (файл bootstrap.js может быть скомпилирован в другой большой JS-файл)?
Ответы:
Все, что вам нужно сделать, это просто проверить, доступен ли метод, специфичный для Bootstrap. В этом примере я буду использовать модальное окно (работает для Bootstrap 2-4):
// Will be true if bootstrap is loaded, false otherwise
var bootstrap_enabled = (typeof $().modal == 'function');
Очевидно, что это не на 100% надежно, поскольку модальная функция может быть предоставлена другим плагином, но, тем не менее, он выполнит свою работу ...
Вы также можете более конкретно проверить Bootstrap 3-4 (работает с версии 3.1+):
// Will be true if Bootstrap 3-4 is loaded, false if Bootstrap 2 or no Bootstrap
var bootstrap_enabled = (typeof $().emulateTransitionEnd == 'function');
Обратите внимание, что для всех этих проверок требуется, чтобы jQuery уже был загружен .
.modal..... Ложные срабатывания повсюду в этом примере.
Я бы предпочел проверить конкретный плагин начальной загрузки, поскольку модальные окна или всплывающие подсказки очень распространены, поэтому
if(typeof($.fn.popover) != 'undefined'){
// your stuff here
}
или же
if (typeof $.fn.popover == 'function') {
// your stuff here
}
работает в обеих версиях бутстрапа
См. Https://github.com/netdna/bootstrap-cdn/issues/111#issuecomment-14467221
<script type="text/javascript">
// <![CDATA[
(function($){
function verifyStyle(selector) {//http://stackoverflow.com/a/983817/579646
var rules;
var haveRule = false;
if (typeof document.styleSheets != "undefined") { //is this supported
var cssSheets = document.styleSheets;
outerloop:
for (var i = 0; i < cssSheets.length; i++) {
//using IE or FireFox/Standards Compliant
rules = (typeof cssSheets[i].cssRules != "undefined") ? cssSheets[i].cssRules : cssSheets[i].rules;
for (var j = 0; j < rules.length; j++) {
if (rules[j].selectorText == selector) {
haveRule = true;
break outerloop;
}
}//innerloop
}//outer loop
}//endif
return haveRule;
}//eof
<!-- BOOTSTRAP JS WITH LOCAL FALLBACK-->
if(typeof($.fn.modal) === 'undefined') {document.write('<script src="<?=$path_js?>/bootstrap.min.js"><\/script>')}
<!-- BOOTSTRAP CDN FALLBACK CSS-->
$(document).ready(function() {
if( verifyStyle('form-inline') )
{
$("head").prepend("<link rel='stylesheet' href='<?=$path_css?>bootstrap.min.css' type='text/css' media='screen'>");
}
else
{
//alert('bootstrap already loaded');
}
});
})(jQuery);
// ]]>
</script>
совместим с безопасным режимом jQuery,
проверка css может потребовать доработки, если вы используете собственный css
AFAIK, короткий ответ
Невозможно определить, загружен ли бутстрап twitter
Загрузчик Twitter - это, по сути, css и набор js-плагинов для jquery. Имена плагинов являются общими, например $ .fn.button, и набор используемых плагинов также можно настроить. Наличие плагина только по имени не поможет установить наличие начальной загрузки.
Вы можете извлекать <script>элементы и проверять их атрибут src, но, как вы указали, вы ищете сам код, а не имя файла, поскольку код может быть в любом файле.
Лучший способ определить, есть ли служба / класс / класс JavaScript / и т. Д. загружается на страницу, это искать в DOM что-то, что, как вы знаете, загружается данным JS.
Например, чтобы определить, загружен ли jQuery, вы можете сделать null !== window.jQueryили узнать версию загруженного jQuery,jQuery.prototype.jquery
Я считаю, что это самый простой способ сделать это. Что касается css, я не уверен, что есть простой способ сделать это.
<script>typeof Alert !== 'undefined' || document.write('<script src="/js/bootstrap/bootstrap.min.js">\x3C/script>')</script>
Добавьте ссылку начальной загрузки и обратите внимание на изменение тега h1.