> 웹 프론트엔드 > JS 튜토리얼 > JS에서 jquery.js를 로딩하는 방법에 대한 자세한 설명

JS에서 jquery.js를 로딩하는 방법에 대한 자세한 설명

php中世界最好的语言
풀어 주다: 2018-05-12 14:01:23
원래의
1926명이 탐색했습니다.

이번에는 JS에서 jquery.js를 로드하는 방법에 대해 자세히 설명하겠습니다. JS에서 jquery.js를 로드할 때 주의사항은 무엇인가요? 다음은 실제 사례입니다. 최근 요구 사항이 있습니다.

1. HTML에는 하나의 JS 파일만 도입할 수 있으며, JS 코드나 다른 JS 파일은 도입할 수 없습니다.

2. 다른 JS 파일도 이 JS 파일에 도입해야 합니다. ;

3. 이 JS 파일에는 모든 JS 기능이 작성되어 있습니다. 이 코드는 jquery 관련 내용을 사용하므로 여기서 가장 먼저 해결해야 할 것은 jquery.js를 도입하는 방법입니다.

인터넷에서 많은 방법을 검색했지만 별로 실용적이지 않았습니다. 오랫동안 웹을 떠나서 친구에게 물어보니 다음 코드가 나왔습니다.

1.js

// by firefoxmmx 
var script=document.createElement("script"); 
script.type="text/javascript"; 
script.src="jquery.js"; 
document.getElementsByTagName('head')[0].appendChild(script); 
setTimeout(function(){ 
$(document).ready(function(){ 
 $("#bt").click(function(){ 
  alert('Hello World'); 
 }); 
}); 
},100);
로그인 후 복사

1.html 코드는 다음과 같습니다.

<html> 
<head> 
 <script type="text/javascript" src="1.js"></script> 
</head> 
<body> 
<input type="button" id="bt" value="Click" /> 
</body> 
</html>
로그인 후 복사
eg. 테스트하려면 직접 다운로드할 수 있는 jquery.js를 추가해야 합니다. 실행 후 버튼을 클릭하면 아래와 같은 효과가 나타납니다.

다음은 인터넷에 있는 몇 가지 방법입니다.

1. 직접 document.write

<script language="javascript">
 document.write("<script src=&#39;test.js&#39;><\/script>");
</script>
로그인 후 복사
2. 기존 스크립트의 src 속성을 동적으로 변경합니다.

<script src=&#39;&#39; id="s1"></script>
<script language="javascript">
 s1.src="test.js"
</script>
로그인 후 복사
3. 스크립트 요소를 동적으로 생성합니다.
<script>
 var oHead = document.getElementsByTagName('HEAD').item(0);
 var oScript= document.createElement("script");
 oScript.type = "text/javascript";
 oScript.src="test.js";
 oHead.appendChild( oScript);
</script>
로그인 후 복사
마스터하신 것 같습니다. 이 기사의 사례를 읽은 후 방법을 알아보세요. 더 흥미로운 내용을 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!

추천 도서:

v-for

JS에서 자주 발생하는 BUG 및 오류

에서 테이블을 내보내는 단계에 대한 자세한 설명

위 내용은 JS에서 jquery.js를 로딩하는 방법에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿