web developer

제이쿼리를 통해 클래스를 추가하는 방법과 직접 스타일을 부여하는 방법과의 차이점 사실 제이쿼리(jQuery)를 사용하여 클래스명을 추가하거나 제거하는 방법이외에 직접 스타일을 부여할 수 있습니다. 예를들어, 아래와 같은 attr() 또는 css() 메소드를 사용하는 방법이 존재합니다. 하지만 이런 경우에 inline 형태로 웹페이지에 스타일이 부여되기 때문에 아래와 같은 제약이 생기게 됩니다. * inline 스타일 방식은 태그에 직접 CSS코드를 기술하는 방식이다. (태그에 style속성을 직접 부여) ※ 이런 단점들 때문에 보통 클래스에 스타일을 정해두고 이 클래스를 추가하거나 제거하는 방법이 사용됩니다. $("Selector").removeClass() .removeClass() 메서드는 선택한 요..

요소 제거하기 : .remove(), .empty() DOM 요소 제거하는 방법으로는 remove() 메서드를 사용하거나 empty() 메서드는 사용하는 방법입니다. SAMPLE remove() 메서드 사용법은 $(selector).remove() 이며, selector 에 해당하는 DOM 요소를 제거합니다. // span 요소 자체가 사라지게 됩니다. 그 결과 태그가 요소가 삭제되었습니다. empty() 메서드 사용법은 $(selector).empty() 이며, selector 에 해당하는 DOM 요소의 내용을 (제거)비웁니다. 따라서 셀렉터로 잡은 span 요소가 아닌 그 내부(하위)의 요소들이 제거됩니다. 출처 : https://dololak.tistory.com/405

요소 내부를 변경하는 태그 : .text() 메소드, .html() 메소드 라이브러리인 jquery 안에서 .text()와 .html() 메소드를 활용하면, 기존 요소의 내부에 새로운 요소나 콘텐츠를 반환하거나 설정할 수 있다. .text() : 해당 요소의 텍스트 콘텐츠를 반환하거나 설정한다. .html() : 해당 요소의 HTML 콘텐츠를 반환하거나 설정한다. .text() 메소드 .text() 메소드는 선택한 요소의 내용을 새로운 단순 text로 변경한다. 안녕하세요. .text() 메소드를 이용하면, 요소의 내용을 새로운 text로 변경할 수 있다. .html() 태그 .html() 메소드는 선택한 요소의 내용을 새로운 HTML 요소로 변경한다. 안녕하세요. .html() 메소드를 이용하면, 요소..

EL(Expression Language) : 정의 표현식 또는 액션 태그를 대신해서 값을 표현하는 언어이고, 표현식 과 액션 태그를 가독성 좋게 짧게 표현한 형태입니다. [EL의 특징] - EL은 jsp스크립트를 대신하여 속성 값들을 좀 더 편리하게 사용하기 위해 제공되는 언어입니다. - EL과 JSTL(Java Standard Tag Library)을 사용하면 와 같은 스크립팅 태그를 JSP에서 없앨 수 있습니다. - EL 표현식은 중괄호( { } )로 묶고 앞에 달러($)기호를 붙이며, 도트 연산자를 사용합니다. - EL은 저장 객체의 출력을 단순화 하는 용도로 사용되므로, 저장 객체를 출력할 때도 스크립팅을 전혀 쓰지 않습니다. - EL은 JSP에서 기본으로 지원하고, JSTL은 따로 설치해야 합..

When to Use Arrays. When to use Objects. JavaScript does not support associative arrays. You should use objects when you want the element names to be strings (text). You should use arrays when you want the element names to be numbers. 개체 속성에 접근할 수 있는 방법 2가지 1) objectName.propertyName 2) objectName["propertyName"] JavaScript Arrays If you use a named index when accessing an array, JavaScript will..

AJAX란? Ajax란 (asynchronous Javascript and XML)의 줄임말 입니다. 자바스크립트를 이용하여 비동기 식으로 서버와 통신을 합니다. Ajax는 프로그램 언어가 아니다. $.ajax() 메소드 $.ajax() 메소드는 모든 jQuery Ajax 메소드의 핵심이 되는 통합적인 메소드이다 . $.ajax() 메소드는 HTTP 요청을 만드는 강력하고도 직관적인 방법을 제공한다. options $.ajax({ options }); $.ajax({ url : 통신을 원하고자 하는 URL주소를 입력합니다.(필수 입력) data : 서버로 보낼 데이터를 입력합니다. type : get, post 등의 통신 방식을 지정합니다. dataType : 통신의 결과로 넘어올 데이터의 종류를 지정합..

DOM (문서 객체 모델) 문서 객체 모델(DOM, Document Object Model)이란 HTML 문서 객체 구조를 말합니다. HTML 문서의 기본 객체 구조는 최상위 객체인 이 있고 하위 객체로 , 가 있습니다. 이때 문서 객체 모델에서는 모든 태그를 객체라고 부르며 , 태그에는 기능과 속성이 포함되어 있습니다. 예를들어 태그는 이미지를 출력하는 기능이 있고 src, alt, width, height와 같은 속성을 포함하고 있습니다. jquery 문법 (1) $(document).ready() $(document).ready()는 문서가 준비되면 매개변수로 넣은 콜백 함수를 실행하라는 의미입니다. * jquery 이벤트 메서드 중 하나입니다. (2) $(function() jQuery 의 간단한..

태그 이름을 사용하여 같은 태그 이름을 가지는 HTML 요소를 모두 선택 $(function() { $("p").on("click", function() { // 요소를 모두 선택함. $("span").css("fontSize", "28px"); // 요소를 모두 선택함. }); }); 아이디(id)를 사용하여 특정 HTML 요소를 선택 $(function() { $("p").on("click", function() { $("#jq").css("border", "2px solid orange"); // 아이디가 "jq"인 요소를 선택함. }); }); 클래스(class)를 사용하여 같은 클래스에 속하는 HTML 요소를 모두 선택 $(function() { $("p").on("click", function..

Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check http://xhr.spec.whatwg.org/. XMLHttpRequest Standard Abstract The XMLHttpRequest Standard defines an API that provides scripted client functionality for transferring data between a client and a server. Table of Contents 1 Introduction 1.1 Specification..

success 작동하지 않는 이유는 다음과 같이 2가지로 나뉘어 볼 수 있음 @ResponseBody 을 사용하지 않아서 작동하지 않는 상황이 발생한다. dataType : 'text' 가 아닌 'json'으로 해놓은 경우도 작동하지 않는 상황이 발생한다.

Request processing failed; nested exception is org.springframework.http.converter.HttpMessageConversionException: Type definition error: [simple type, class com.jslhrd.domain.BoardVO]; nested exception is com.fasterxml.jackson.databind.exc.InvalidDefinitionException: Cannot construct instance of `com.jslhrd.domain.BoardVO` (no Creators, like default constructor, exist): cannot deserialize from O..

1. css .button{ padding: 2px 10px; background-color:#FF6600; border-radius: 4px; color: white; cursor: pointer; } 2. jsp파일 3. 구현된 button