IT

JavaScript 파일을 HTML 파일에 어떻게 연결합니까?

lottoking 2020. 5. 26. 08:04
반응형

JavaScript 파일을 HTML 파일에 어떻게 연결합니까?


JavaScript 파일을 HTML 문서에 올바르게 링크하는 방법은 무엇입니까?

둘째, JavaScript 파일 내에서 jQuery를 어떻게 사용합니까?


먼저 http://jquery.com/ 에서 JQuery 라이브러리를 다운로드 한 다음 html head 태그 내에서 다음과 같은 방법으로 jquery 라이브러리를로드하십시오.

그런 다음 jquery 로딩 스크립트 후 jquery 코드를 코딩하여 jquery가 작동하는지 테스트 할 수 있습니다

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<!--LINK JQUERY-->
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<!--PERSONAL SCRIPT JavaScript-->
<script type="text/javascript">
   $(function(){
      alert("My First Jquery Test");
   });
</script>

</head>
<body><!-- Your web--></body>
</html>

jquery 스크립트 파일을 별도로 사용하려면 jquery 라이브러리로드 후이 방법으로 외부 .js 파일을 정의해야합니다.

<script type="text/javascript" src="jquery-3.3.1.js"></script>
<script src="js/YourExternalJQueryScripts.js"></script>

실시간 테스트

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<!--LINK JQUERY-->
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<!--PERSONAL SCRIPT JavaScript-->
<script type="text/javascript">
   $(function(){
      alert("My First Jquery Test");
   });
</script>

</head>
<body><!-- Your web--></body>
</html>


이것은 HTML로 JS 파일을 연결하는 방법입니다

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

<script> -태그는 JavaScript와 같은 클라이언트 측 스크립트를 정의하는 데 사용됩니다.

type -스크립트 유형을 지정하십시오

src -스크립트 파일 이름 및 경로


자바 스크립트 파일을 가리키는 HTML 문서에 스크립트 태그를 추가 할 수 있습니다. 스크립트 태그의 순서가 중요합니다. 스크립트에서 jQuery를 사용하려면 스크립트 파일보다 먼저 jQuery를로드하십시오.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="relative/path/to/your/javascript.js"></script>

그런 다음 자바 스크립트 파일에서 $sign 또는을 사용하여 jQuery를 참조 할 수 있습니다 jQuery. 예:

jQuery.each(arr, function(i) { console.log(i); }); 

외부 자바 스크립트 파일을 포함하려면 <script>태그 를 사용합니다 . src속성은 웹 프로젝트에서 Javascript 파일의 위치를 ​​가리 킵니다.

<script src="some.js" type="text/javascript"></script>

JQuery는 단순히 자바 스크립트 파일이므로 파일의 사본을 다운로드하는 경우 스크립트 태그를 사용하여 페이지에 파일을 포함시킬 수 있습니다. Google에서 호스팅하는 것과 같은 콘텐츠 배포 네트워크의 Jquery를 포함 할 수도 있습니다.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

Below you have some VALID html5 example document. The type attribute in script tag is not mandatory in HTML5.

You use jquery by $ charater. Put libraries (like jquery) in <head> tag - but your script put allways at the bottom of document (<body> tag) - due this you will be sure that all libraries and html document will be loaded when your script execution starts. You can also use src attribute in bottom script tag to include you script file instead of putting direct js code like above.

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Example</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
</head>
<body>
    <div>Im the content</div>

    <script>
        alert( $('div').text() ); // show message with div content
    </script>
</body>
</html>

참고URL : https://stackoverflow.com/questions/13739568/how-do-i-link-a-javascript-file-to-a-html-file

반응형