페이지에로드 된 bootstrap.js가 있는지 어떻게 확인할 수 있습니까 (bootstrap.js 파일은 다른 큰 JS 파일로 컴파일 될 수 있음)?
답변
필요한 것은 부트 스트랩 특정 방법이 사용 가능한지 확인하는 것뿐입니다. 이 예제에서는 모달을 사용합니다 (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가 이미로드되어 있어야합니다 .
답변
모달 또는 툴팁이 매우 일반적이므로 특정 부트 스트랩 플러그인을 확인하고 싶습니다.
if(typeof($.fn.popover) != 'undefined'){
// your stuff here
}
또는
if (typeof $.fn.popover == 'function') {
// your stuff here
}
두 부트 스트랩 버전에서 작동
답변
if (typeof([?])=='undefined') { /*bootstrap is not loaded */}
여기서 [?]는 JS 파일 자체 내에 정의 된 객체 또는 네임 스페이스입니다.
“포함”이라는 개념은 자바 스크립트에 존재하지 않습니다.
답변
참조 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 부트 스트랩은 기본적으로 CSS이며 jquery에 대한 js 플러그인 세트입니다. 플러그인 이름은 $ .fn.button과 같이 일반적이며 사용할 플러그인 세트도 사용자 정의 할 수 있습니다. 이름만으로 플러그인이 있으면 부트 스트랩이 있는지 확인하는 데 도움이되지 않습니다.
답변
<script>요소 를 검색 하고 해당 src 속성을 확인할 수 있지만 지적했듯이 코드가 모든 파일에있을 수 있으므로 파일 이름이 아닌 코드 자체를 찾고 있습니다.
JavaScript 서비스 / 클래스 / 등을 감지하는 가장 좋은 방법입니다. 페이지에로드되면 주어진 JS에 의해로드되는 것을 알고있는 DOM에서 무언가를 찾는 것입니다.
예를 들어 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>
