기존 요소의 내부에 추가 다음 메서드를 사용하면 기존 요소의 내부에 새로운 요소나 콘텐츠를 추가할 수 있다. append 메서드 .append() 메서드는 선택된 요소의 마지막에 새로운 HTML 요소나 콘텐츠를 추가한다. 첫 번째 아이템 두 번째 아이템 $('#list').append('새로 추가된 아이템'); .append() 메서드를 이용하면, 두 번째 뒤에 새로운 HTML 요소를 추가할 수 있다. prepend 메서드 .prepend() 메서드는 선택한 요소의 첫 번째에 새로운 요소나 콘텐츠를 추가한다. 첫 번째 아이템 두 번째 아이템 $('#list').prepend('새로 추가된 아이템'); prepend() 메서드를 이용하면, 첫 번째 에 앞에 새로운 HTML 요소를 추가할 수 있다. appe..
정보: Error parsing HTTP request header Note: further occurrences of HTTP header parsing errors will be logged at DEBUG level. java.lang.IllegalArgumentException: Invalid character found in the request target. The valid characters are defined in RFC 7230 and RFC 3986 해당 에러는 브라우저 차이에서 나타난 에러이다. 크롬이나 파이어폭스의 경우 URL을 자동으로 인코딩해서 전송하지만, IE의 경우 자동으로 인코딩이 안되기 때문에 발생하는 오류이다. 페이징 이동이나 Ajax 요청에서 쿼리 파라미터로 요청하..
SpingBoot에서 에러가 날 경우 기본적으로 whitelabel 페이지로 이동하여 아래와 같은 에러 화면이 나타난다. # SpringBoot 기본 에러 설정 server.error: include-exception: false include-stacktrace: never path: '/error' whitelabel.enabled: true server.error.include-exception : 응답에 exception의 내용을 포함할지 여부 server.error.include-stacktrace : 응답에 stacktrace 내용을 포함할지 여부 server.error.path : 오류 응답을 처리할 핸들러(ErrorController)의 path server.error.whitelabel...
Interceptor에서 API 요청인지 페이지 이동인지 구분해야 할 때가 있다. 간단하게 API 요청 여부에 대해 확인하는 방법을 알아보자. Http 요청을 하게 되면 요청 헤더에 "X-Request-With" 필드에 "XMLHttpRequest" 값이 포함된 것을 확인할 수 있다. X-Request-With의 접두사 X는 비표준을 의미한다. 하지만 jQuery와 같은 대중적인 라이브러리들이 Ajax 요청 시 헤더에 정보를 담아 전송을 요청한다. 이것을 활용하면 API 호출 여부를 판별하기 쉽다. private boolean isAjaxRequest(HttpServletRequest request) { String header = request.getHeader("X-Requested-With"); i..
선택자에 의해 선택된 요소의 값을 읽거나 설정하기 위해서는 jQuery 메서드를 통해 해당 요소에 접근할 수 있다. getter/setter 메서드 getter 메서드는 선택된 요소에 접근하여 그 값을 읽어오기 위한 메서드이다. getter 메서드는 아무런 인수를 전달하지 않고 호출한다. setter 메서드는 선택된 요소에 접근하여 그 값을 설정하기 위한 메서드이다. setter 메서드는 대입하고자 하는 값을 인수로 전달하여 호출한다. var const = $('#hello').html(); $('#newText').html(newText); 요소에 접근하여 요소의 값을 읽거나 설정할 수 있도록 해주는 대표적인 getter 메서드와 setter 메서드는 다음과 같다. method chaining gett..
jQuery에서는 CSS 선택자뿐만 아니라 몇몇 비표준 선택자까지도 사용할 수 있다. 이러한 비표준 선택자를 사용하면 선택한 요소를 저장하거나, 그 결과에 대해 필터링까지 할 수 있다. 선택한 요소를 변수에 저장 jQuery에서는 선택한 요소들을 변수에 저장하여 사용할 수 있다. 바나나 레몬 수박 const fruits = $('li'); $('#length').text('과일의 종류는 총 ' + fruits.length + '가지 입니다.'); 선택한 요소를 필터링 jQuery에서는 선택한 요소 중에서 더욱 세분화된 선택을 하기 위한 필터링을 진행할 수 있다. 바나나 레몬 수박 $('li:has(b)').append(' - 추천 과일입니다.'); input 요소의 선택 jQuery에서는 입력 양식에 관..
jQuery에서는 CSS 선택자를 사용하여 HTML 요소를 선택할 수 있다. 태그 이름으로 선택 요소(element)의 태그 이름으로 HTML 요소를 모두 선택할 수 있다. 이는 자바스크립트의 getElementsByTagName() 메서드와 동일한 동작을 한다. $('button').on('click', function() { $('span').css('fontSize', '30px'); }); 아이디로 선택 요소의 아이디(id)로 특정 HTML 요소를 선택할 수도 있다. 이는 자바스크립트의 getElementsById() 메서드와 동일한 동작을 한다. $('button').on('click', function() { $('#selectorId').css('fontSize', '30px'); }); 클..
jQuery를 사용하면 아주 간편하게 HTML 요소를 선택하고, 그렇게 선택된 요소에 손쉽게 특정 동작을 설정할 수 있다. $(selector).함수(); 달러($) 기호는 jQuery를 의미하고, jQuery에 접근할 수 있게 해주는 식별자이다. 선택자를 이용하여 원하는 HTML 요소를 선택하고, 동작 함수를 정의하여 선택된 요소에 원하는 동작을 설정한다. $() 함수 $() 함수는 선택된 HTML 요소를 jQuery에서 이용할 수 있는 형태로 생성해 주는 역할을 한다. $() 함수의 인수로는 HTML 태그 이름뿐만 아니라, CSS 선택자를 전달하여 특정 HTML 요소를 선택할 수 있다. 이러한 $() 함수를 통해 생성된 요소를 jQuery 객체(jQuery object)라고 한다. jQuery는 이렇..
jQuery 적용 jQuery는 자바스크립트 라이브러리이므로, jQuery 파일은 자바스크립트 파일(.js 파일) 형태로 존재한다. 따라서 웹 페이지에서 jQuery를 사용하기 위해서는 jQuery 파일을 먼저 웹 페이지에 로드(load) 해야 한다. 웹 페이지에 jQuery 파일을 로드하는 방법은 다음과 같다. jQuery 파일을 다운받아 로드 CDN(Content Delivery Network)을 이용하여 로드 jQuery 다운로드 최신 버전의 jQuery 파일은 다음 공식 사이트에서 다운로드할 수 있다. http://blog.jquery.com/ Official jQuery Blog | New Wave Javascript Hello again! jQuery 3.4.0 was released just..
- Eclipse
- 제주도 여행
- sort algorithm
- 리액트
- Linux 명령어
- 리액트 16
- spring
- 프로그래머스
- Tomcat
- Maven
- Java
- 리눅스 명령어
- 소프트웨어공학
- 정렬 알고리즘
- 회고
- 성능분석
- javascript
- 자바스크립트
- 프로그래머
- SQL
- 자바
- React
- 제주도 3박4일 일정
- 오라클
- 경력관리
- effective java
- 이직
- 오라클 내장 함수
- Collection
- 개발환경
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |