Spring MVC와 함께 jQuery를 사용하는 기본적인 문법
jQuery는 JavaScript 라이브러리로, HTML 문서의 이벤트 처리, 애니메이션, Ajax 통신 등을 쉽게 할 수 있게 도와줍니다. jQuery를 사용하려면 먼저 HTML 페이지에 jQuery 라이브러리를 포함해야 합니다.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
jQuery 라이브러리 포함: HTML 페이지의 <head> 섹션에 다음 코드를 추가합니다.
기본 문법:
- 문서 준비 이벤트: 페이지 로드 시 실행되는 스크립트입니다.
$(document).ready(function(){
// 여기에 코드 작성
});
요소 선택: HTML 요소를 jQuery로 선택하는 방법입니다.
$("#myId") // ID가 myId인 요소 선택
$(".myClass") // 클래스가 myClass인 모든 요소 선택
$("p") // 모든 <p> 요소 선택
이벤트 처리: 요소에 이벤트 리스너를 추가합니다.
$("#myButton").click(function(){
// 버튼 클릭 시 실행될 코드
});
HTML/CSS 조작: 요소의 HTML이나 CSS를 조작합니다.
$("#myElement").html("새로운 내용"); // HTML 내용 변경
$("#myElement").css("color", "blue"); // CSS 속성 변경
Ajax 요청: 서버에 비동기 요청을 보냅니다.
$.ajax({
url: '/myEndpoint',
type: 'GET', // 또는 'POST'
success: function(response){
// 요청 성공 시 실행될 코드
},
error: function(error){
// 요청 실패 시 실행될 코드
}
});
Spring MVC와 함께 jQuery를 사용할 때, 주로 서버로부터 데이터를 비동기적으로 가져오거나,
페이지의 일부분만을 갱신하는 데에 많이 사용됩니다.
이러한 방식으로 사용자 경험을 향상시킬 수 있으며, 동적인 웹 페이지를 만드는 데 도움이 됩니다.
'BACKEND > 스프링 Spring' 카테고리의 다른 글
| 스프링으로 게시판 페이징처리 회원가입 댓글 로그인 파일업로드 암호화 회원탈퇴 키워드 검색 (0) | 2024.01.18 |
|---|---|
| Spring 메시지 , 국제화 (0) | 2024.01.16 |
| Spring MVC를 사용하여 Ajax 요청 (0) | 2024.01.14 |
| [Spring] logging 에 대해 알아보자 (0) | 2024.01.10 |
| 인텔리제이 Port 8080 was already in use 해결 (0) | 2024.01.09 |
