>웹 프론트엔드 >JS 튜토리얼 >jquery가 외부 CDN을 가져오고 로드에 실패할 때 로컬 jq 라이브러리를 도입하는 방법

jquery가 외부 CDN을 가져오고 로드에 실패할 때 로컬 jq 라이브러리를 도입하는 방법

不言
不言원래의
2018-07-04 10:54:543747검색

이 글에서는 주로 웹사이트에서 타사 CDN을 로드하는 방법을 소개합니다. jQuery 라이브러리가 실패할 경우 로컬 jquery 구현 코드가 로드됩니다. 필요한 친구는

Due를 참조하세요. 타사 CDN 라이브러리 인기가 높기 때문에 많은 친구들이 타사 클래스 라이브러리를 선택합니다. 학습 관점에서 모든 사람이 클래스 라이브러리를 사용하는 것은 권장되지 않습니다. 이런 식으로 우리는 많은 학습 기회를 잃습니다. 하지만 사용 측면에서는 많은 코드 호환성 문제를 해결하지만 여기서는 다루지 않습니다.

CDN을 사용하여 jQuery 라이브러리를 로드하면 대역폭을 일부 절약할 수 있으며 사용자에게 더 빠른 페이지 로딩 환경을 제공할 수 있습니다.

개인 웹사이트 크기와 CDN 대역폭 문제로 인해 지금은 CDN 비용이 내려갔지만 여전히 타사 jquery 라이브러리를 사용하는 친구들이 많습니다. 개인적으로 국내 여러 Baidu, Sina, bootcdn을 추천합니다

다음 두 코드의 역할은 cdn의 jquery가 로드되지 않은 경우 로컬 클래스 라이브러리를 사용할 수 있다는 것입니다.

jquery 다운로드 주소

첫 번째: 권장 사용

<script src="//apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
 if (typeof jQuery == &#39;undefined&#39;) {
 document.write(unescape("%3Cscript src=&#39;/skin/mobile/js/jquery.min.js&#39; type=&#39;text/javascript&#39;%3E%3C/script%3E"));
 }
</script>

#🎜 🎜#

위에서는 Baidu CDN의 jQuery 라이브러리를 인용한 다음, jQuery 라이브러리가 성공적으로 로드되었는지 확인하기 위해 스크립트 코드 뒤에 if 문을 추가했습니다. 성공적으로 로드되지 않은 경우 로컬을 동적으로 로드했습니다. jQuery 라이브러리.

그 중 document.write 메서드에서 URL 인코딩을 직접 사용하여 "<"를 "%3C"로 인코딩한 다음 unescape() 메서드를 사용하여 문자열을 복원합니다.

unescape() 메서드를 통해 문자열을 다시 변환하면 출력이 일반 스크립트 참조 코드임을 확인할 수 있습니다.

이제 질문이 있습니다. "일반 문자를 사용하지 않고 문자 인코딩을 사용하는 이유는 무엇입니까?" 사실 여기에는 이유가 있습니다. XML, XHTML 또는 CDATA에 코드를 포함하지 않고 HTML에서 정상적으로 실행합니다(자세한 내용은 여기를 참조하세요).

두 번째 유형:

<script src="http://lib.sinaapp.com/js/jquery11/1.8/jquery.min.js"></script>
<script>window.jQuery || document.write(unescape("%3Cscript src=&#39;/skin/mobile/js/jquery.min.js&#39; type=&#39;text/javascript&#39;%3E%3C/script%3E"))</script>

위의 유형은 원칙을 따릅니다. 이는 || 연산자

Expression a || Expression b: 표현식 a의 결과를 계산합니다(함수일 수도 있음).

#🎜 🎜# Fasle인 경우 표현식 b(또는 함수)를 실행하고 b의 결과를 반환합니다.

True인 경우 a의 결과를 반환합니다.

은 다음을 의미합니다. .jQuery가 false이면 로컬 jquery 라이브러리가 로드됩니다.

requireJs cdn 실패를 언급한 후 로컬 js 로드

문제: 페이지에 js 및 css 참조가 너무 많으면 페이지 로드 속도가 느려집니다. #🎜 ### 引#Quote CDN의 JS 및 CSS는 로컬 영역에서 직접보다 짧습니다#🎜🎜 ## 🎜🎜#해결책: 로컬 프로젝트의 페이지에서 JS 및 CSS를 사용하여 페이지를 로드합니다. 페이지가 CDN 로딩이 됩니다. 다음과 같은 변경이 필요합니다:

1.jquery: ["https://cdn.bootcssddd.com/jquery/1.11.1/jquery.min"," static/lib/jquery/jquery-1.9.min"],

2. 다음과 같이 build.js 코드를 추가합니다

({
  baseUrl: "/js",
  paths: {
    "jquery": "empty:"
    
  },
  dir: "/js-build",
  optimize: "uglify",
  optimizeCss: "standard.keepLines",
  mainConfigFile: "config.js",//config.js为1中引用的文件
  removeCombined: true,
})

#🎜🎜 #

위 내용은 이 글의 전체 내용입니다. 모든 분들의 학습에 도움이 되었으면 좋겠습니다. 더 많은 관련 내용은 PHP 중국어 홈페이지를 주목해주세요!

관련 권장사항:

jquery.onoff로 구현된 스위치 버튼 기능

#🎜 🎜 #양식에 데이터를 동적으로 추가하고 삭제하는 작업을 구현하는 jQuery에 대하여


위 내용은 jquery가 외부 CDN을 가져오고 로드에 실패할 때 로컬 jq 라이브러리를 도입하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.