jQuery를 4.0.0 마이그레이션 방법

빌런포럼 개발포럼 개발 팁/강좌

hobby ino 쪽지 승인 : 2026-01-20 18:21:41

jQuery 팀은 업그레이드 시 발생하는 문제를 자동으로 감지하고 해결책을 제시하는 jQuery Migrate 4.0.0 플러그인을 함께 제공합니다.

2. 브라우저 개발자 도구(F12)의 콘솔창을 확인합니다. 삭제된 함수를 사용 중이라면 경고(Warning)와 함께 교체해야 할 함수 정보가 나타납니다.

3. 코드 수정: 경고가 나타나지 않을 때까지 코드를 수정한 뒤, 최종 배포 시에는 Migrate 플러그인을 제거합니다.

4.0.0에서는 예전부터 "사용 권장 안 함(Deprecated)"이었던 유틸리티 함수들이 대거 삭제되었습니다. 이제는 브라우저 내장 함수(Native JS)를 사용해야 합니다.

삭제된 함수	현대적인 대체 코드 (Native JS)
jQuery.trim(str)	str.trim()
jQuery.isArray(obj)	Array.isArray(obj)
jQuery.parseJSON(str)	JSON.parse(str)
jQuery.now()	Date.now()
jQuery.isFunction(obj)	typeof obj === "function"
jQuery.type(obj)	Object.prototype.toString.call(obj) 등

마이그레이션 전, 서비스의 지원 대상을 확인해야 합니다.

IE 10 이하: 더 이상 지원하지 않습니다. 만약 IE 10 이하를 반드시 지원해야 한다면 jQuery 3.x에 머물러야 합니다.
IE 11: 지원은 하지만 "최소한의 수준"이며, 다음 버전인 5.0에서는 완전히 제거될 예정입니다.
Edge: 레거시 Edge(크로미움 이전 버전) 지원이 중단되었습니다.

// npm으로 설치한 경우

import $ from 'jquery';

// 브라우저에서 직접 모듈로 호출

import $ from 'https://code.jquery.com/jquery-4.0.0.js';

$('body').append('<h1>Hello jQuery 4!</h1>');

</script>

AJAX 내부 동작
1. 과거에는 $.ajax로 스크립트를 요청하면 인라인으로 실행했으나, 이제는 실제 <script> 태그를 생성하여 실행합니다.
2. 이는 보안 정책(CSP) 준수를 위함입니다.
이벤트 시스템
1. jQuery.event.props 및 jQuery.event.fixHooks가 제거되었습니다.
2. 아주 오래된 플러그인을 사용 중이라면 이 부분에서 오류가 날 수 있습니다.
Trusted Types
1. 보안이 강화된 환경(CSP 설정 등)에서 DOM에 HTML을 삽입할 때 발생하던 보안 경고를 jQuery가 자체적으로 처리하기 시작했습니다.

TAG