jQuery.getScript( url [, success ] )
설명 : GET HTTP 요청을 사용하여 서버에서 JavaScript 파일을로드 한 다음 실행하십시오.
$.ajax({
url: url,
dataType: "script",
success: success
});
스크립트는 전역 컨텍스트에서 실행되므로 다른 변수를 참조하고 jQuery 함수를 사용할 수 있습니다. 포함 된 스크립트는 현재 페이지에 영향을 줄 수 있습니다.
성공 콜백
스크립트가로드되었지만 반드시 실행되지는 않으면 콜백이 시작됩니다.
스크립트는 파일 이름을 참조하여 포함되고 실행됩니다.
$.getScript( "ajax/test.js", function( data, textStatus, jqxhr ) {
console.log( data ); // Data returned
console.log( textStatus ); // Success
console.log( jqxhr.status ); // 200
console.log( "Load was performed." );
});
오류 처리
jQuery 1.5부터는 .fail()오류를 설명 하는 데 사용할 수 있습니다 .
$.getScript( "ajax/test.js" )
.done(function( script, textStatus ) {
console.log( textStatus );
})
.fail(function( jqxhr, settings, exception ) {
$( "div.log" ).text( "Triggered ajaxError handler." );
});
jQuery 1.5 이전에는 오류 .ajaxError()를 처리하기 위해 전역 콜백 이벤트를 사용해야했습니다 $.getScript().
$( "div.log" ).ajaxError(function( e, jqxhr, settings, exception ) {
if ( settings.dataType == "script" ) {
$( this ).text( "Triggered ajaxError handler." );
}
});
응답 캐싱
기본적으로 $.getScript()캐시 설정을로 설정합니다 false. 이렇게하면 요청 URL에 timestamped 쿼리 매개 변수가 추가되어 요청할 때마다 브라우저에서 스크립트를 다운로드합니다. 다음을 사용하여 cache 속성을 전역으로 설정하여이 기능을 무시할 수 있습니다 $.ajaxSetup().
$.ajaxSetup({
cache: true
});
또는 더 유연한 $.ajax()방법 을 사용하는 새 메서드를 정의 할 수 있습니다.
예 :
캐시 된 스크립트를 가져올 수있는 $ .cachedScript () 메서드를 정의하십시오.
jQuery.cachedScript = function( url, options ) {
// Allow user to set any option except for dataType, cache, and url
options = $.extend( options || {}, {
dataType: "script",
cache: true,
url: url
});
// Use $.ajax() since it is more flexible than $.getScript
// Return the jqXHR object so we can chain callbacks
return jQuery.ajax( options );
};
// Usage
$.cachedScript( "ajax/test.js" ).done(function( script, textStatus ) {
console.log( textStatus );
});
부하 공식 jQuery를 컬러 애니메이션 플러그인을 동적으로 새로운 기능이로드되면 발생하는 몇 가지 컬러 애니메이션을 결합한다.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery.getScript demo</title>
<style>
.block {
background-color: blue;
width: 150px;
height: 70px;
margin: 10px;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<button id="go">» Run</button>
<div class="block"></div>
<script>
var url = "https://code.jquery.com/color/jquery.color.js";
$.getScript( url, function() {
$( "#go" ).click(function() {
$( ".block" )
.animate({
backgroundColor: "rgb(255, 180, 180)"
}, 1000 )
.delay( 500 )
.animate({
backgroundColor: "olive"
}, 1000 )
.delay( 500 )
.animate({
backgroundColor: "#00f"
}, 1000 );
});
});
</script>
</body>
</html>
게시글 목록
| 번호 | 제목 |
|---|---|
| 15935 |
jQuery
jQuery ( ": first-child")
1
|
| 15934 |
jQuery
.first()
|
| 15933 |
jQuery
.finish ([queue])
|
| 15932 |
jQuery
.find (selector)
|
| 15931 |
jQuery
.filter (selector)
|
| 15930 |
jQuery
jQuery ( ": file")
|
| 15929 | |
| 15928 | |
| 15924 | |
| 15923 | |
| 15922 |
jQuery
event.which
|
| 15921 |
jQuery
event.type
|
| 15920 |
jQuery
event.timeStamp
|
| 15919 |
jQuery
event.target
|
| 15917 |
jQuery
event.stopPropagation ()
|
| 15916 | |
| 15915 |
jQuery
event.result
|
| 15914 |
jQuery
event.relatedTarget
|
| 15913 | |
| 15912 |
jQuery
event.result
|
| 15911 |
jQuery
event.relatedTarget
|
| 15910 |
jQuery
event.preventDefault ()
|
| 15909 |
jQuery
event.pageY
|
| 15908 |
jQuery
event.pageX
|
| 15907 |
jQuery
event.namespace
|
| 15906 |
jQuery
event.metaKey
|
| 15901 | |
| 15900 |
기타
vi 명령모드
|
| 15899 |
기타
vi 입력모드
|
| 15898 |
기타
vi의 세가지 모드
|
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기