>  기사  >  웹 프론트엔드  >  jquery 및 js_javascript 기술을 사용하여 js 파일을 동적으로 로드하는 방법

jquery 및 js_javascript 기술을 사용하여 js 파일을 동적으로 로드하는 방법

WBOY
WBOY원래의
2016-05-16 15:18:561063검색

이 문서의 예에서는 jquery와 js가 js 파일의 동적 로드를 구현하는 방법을 설명합니다. 참고하실 수 있도록 모든 사람과 공유하세요. 자세한 내용은 다음과 같습니다.

질문:

jquery Append를 사용하여 스크립트 태그를 직접 로드하면 오류가 보고됩니다. document.write 외에 js 파일을 동적으로 로드하는 더 좋은 방법이 있습니까?

해결책:

1. 제이쿼리 방식

$.getScript("./test.js");  //加载js文件
$.getScript("./test.js",function(){  //加载test.js,成功后,并执行回调函数
  console.log("加载js文件");
});

2.js 메소드

<html>
<body>
</body>
</html>
<script type="text/javascript">
function loadScript(url, callback) {
  var script = document.createElement("script");
  script.type = "text/javascript";
  if(typeof(callback) != "undefined"){
    if (script.readyState) {
      script.onreadystatechange = function () {
        if (script.readyState == "loaded" || script.readyState == "complete") {
          script.onreadystatechange = null;
          callback();
        }
      };
    } else {
      script.onload = function () {
        callback();
      };
    }
  }
  script.src = url;
  document.body.appendChild(script);
}
loadScript("jquery-latest.js", function () { //加载,并执行回调函数
  alert($(window).height());
});
//loadScript("jquery-latest.js"); //加载js文件
</script>

더 많은 JavaScript 관련 콘텐츠에 관심이 있는 독자는 이 사이트의 특별 주제인 "JavaScript 오류 및 디버깅 기술 요약" 및 "JavaScript 확장 기술 요약"

이 기사가 JavaScript 프로그래밍에 종사하는 모든 사람에게 도움이 되기를 바랍니다.

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