JavaScript 파일을 HTML 파일에 링크하려면 어떻게 해야 합니까?
JavaScript 파일을 HTML 문서에 올바르게 링크하려면 어떻게 해야 합니까?
두 번째로 JavaScript 파일 내에서 jQuery를 사용하는 방법은 무엇입니까?
먼저 http://jquery.com/에서 JQuery 라이브러리를 다운로드하고 다음 방법으로 html 헤드태그에 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- 스크립트 파일 이름과 경로
외부 Javascript 파일을 포함하려면<script>태그.src속성은 웹 프로젝트 내에서 Javascript 파일의 위치를 가리킵니다.
<script src="some.js" type="text/javascript"></script>
JQuery는 단순한 Javascript 파일이기 때문에 파일 복사본을 다운로드하면 스크립트 태그를 사용하여 페이지에 포함할 수 있습니다.Google에서 호스팅하는 네트워크와 같은 컨텐츠 배포 네트워크의 Jquery를 포함할 수도 있습니다.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
HTML 문서에 스크립트태그를 추가할 수 있습니다.내부에서는 Javascript 파일을 가리킵니다.스크립트 태그의 순서는 중요합니다.스크립트에서 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>
그런 다음 javascript 파일에서 jQuery를 참조할 수 있습니다.$서명 또는jQuery. 예:
jQuery.each(arr, function(i) { console.log(i); });
다음은 유효한 html5 예제 문서입니다.그type에 귀속시키다.scriptHTML5에서는 태그는 필수가 아닙니다.
jquery 사용 방법$문자라이브러리(jquery 등)를 에 넣습니다.<head>tag - 단, 스크립트는 항상 문서 하단에 배치됩니다(<body>tag) - 이로 인해 스크립트 실행 시작 시 모든 라이브러리와 html 문서가 로드됩니다.를 사용할 수도 있습니다.src위와 같이 직접 js 코드를 입력하는 대신 스크립트 파일을 포함하도록 스크립트 태그의 속성을 지정합니다.
<!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>this is demo code but it will help
<!DOCTYPE html>
<html>
<head>
<title>APITABLE 3</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$.ajax({
type: "GET",
url: "https://reqres.in/api/users/",
data: '$format=json',
dataType: 'json',
success: function (data) {
$.each(data.data,function(d,results){
console.log(data);
$("#apiData").append(
"<tr>"
+"<td>"+results.first_name+"</td>"
+"<td>"+results.last_name+"</td>"
+"<td>"+results.id+"</td>"
+"<td>"+results.email+"</td>"
+"<td>"+results.bentrust+"</td>"
+"</tr>" )
})
}
});
});
</script>
</head>
<body>
<table id="apiTable">
<thead>
<tr>
<th>Id</th>
<br>
<th>Email</th>
<br>
<th>Firstname</th>
<br>
<th>Lastname</th>
</tr>
</thead>
<tbody id="apiData"></tbody>
</body>
</html>
언급URL : https://stackoverflow.com/questions/13739568/how-do-i-link-a-javascript-file-to-a-html-file
'programing' 카테고리의 다른 글
| MySQL: 데이터베이스 삭제 오류(errno 13, errno 17, errno 39) (0) | 2022.12.20 |
|---|---|
| Larabel Mix에 Font Awesome을 설치하는 방법 (0) | 2022.12.20 |
| Moment.js에서의 권장 해제 경고 - 인식된 ISO 형식이 아닙니다. (0) | 2022.12.20 |
| 다른 테이블 쿼리에 대해 MySQL이 매우 느립니다. (0) | 2022.12.10 |
| Galera 첫 번째 노드가 시작되지 않습니다. (0) | 2022.12.10 |