반응형 제이쿼리8 JQuery(제이쿼리) Method/ .remove() - 선택한 요소를 제거하는 메서드) JQuery(제이쿼리) Method/ .remove() - 선택한 요소를 제거하는 메서드) .remove() .remove()는 선택한 요소를 HTML 문서에서 제거한다. 문법 .remove( [selector] ) 특정 선택자를 가진 요소를 제거할 때는 괄호 안에 선택자를 넣는다. 예를 들어 $( 'p' ).remove( '.rm' ); 은 클래스 값으로 rm을 가진 p 요소를 제거한다. 다음과 같이 해도 결과는 같다. $( 'p.rm' ).remove(); 예제 버튼을 클릭하면 rm을 클래스 값으로 가지는 h1 요소를 제거한다. Click to Remove h1 Heading Lorem ipsum dolor. 결과) 참고 선택한 요소의 내용만 지울 때는 .empty()를 사용한다. 선택한 .. 2023. 11. 25. JQuery(제이쿼리) Method /.val(), html(), text() - 양식(form)의 값을 가져오거나 값을 설정하는 메소드 JQuery(제이쿼리) Method /.val(), html(), text() - 양식(form)의 값을 가져오거나 값을 설정하는 메소드 .val() from의 선택 요소 텍스트 값을 설정 혹은 받아옴 .val()은 양식(form)의 값을 가져오거나 값을 설정하는 메소드 - val() : input, select,textarea 등의 form elements에서 값을 구한다. .val(value) : form elements에 값을 지정한다. - 값을 변경 할 때 : $(변경할 부분 선택).val(값); 값을 가져 올 때 : $(변경할 부분 선택).val(값); ex) $('input').val('helloworld); //input의 value 값에 helloworld라고 넣는다 $('input')... 2023. 11. 25. JQuery(제이쿼리) 속성추가, 제거, jquery attr(), removeAttr() JQuery(제이쿼리) 속성추가, 제거, jquery attr(), removeAttr() 제이쿼리 속성추가, 제거, jquery attr(), removeAttr() - attr() 사용방법 jquery 의 attr() 메소드는 선택된 요소의 속성이나 값을 설정, 또는 리턴하는데 사용된다. 이 메소드가 그 속성값을 리턴할 때, 이것은 첫번째로 매치되는 요소의 값을 리턴한다. 이 메소드가 그 속성값을 설정할때, 이것은 매치되는 요소들의 하나 이상의 속성/값의 묶음으로 설정한다. 1. 속성값을 리턴 $(selector).attr(attribute) 예) 이미지가 있을 때 이 요소의 width 속성값을 경고창에 띄우는 예이다. 2. 속성과 값을 설정 $(selector).attr(attribute,v.. 2023. 11. 25. JQuery(제이쿼리) 이벤트 사용시 $(this)의미와 활용 JQuery(제이쿼리) 이벤트 사용시 $(this)의미와 활용 $(this)는 일종의 변수, 선택자라고 볼 수 있다. 일반적으로 동일한 소스가 반복되는 네비게이션 메뉴, 탭, 아코디언메뉴, 리스트등에서 많이 활용. 활용 예) btn이라는 class를 동일하게 가진 버튼들이 존재할때 현재는 어느버튼을 눌러도 class가 같기 때문에 모든 버튼에 글씨가 변하는 것을 볼 수 있다. 이 this를 활용하여 타겟버튼만 변경되게 바꿔보면 button.click(function(){ $(this).val("눌렀어~"); }); 이 부분만 바꾸면 만약 이 방법을 안쓴다면 아래 예제소스와 같이 각 버튼마다 id를 별도로 줘야한다. 각각의 이벤트를 만들어주는 번거롭고 비효율적인 일을 할수도 있다. 그러니 이 $(t.. 2023. 11. 25. Jquery(제이쿼리) 차트만들기, Ajax를 이용해 날씨차트만들기 ● 차트만들기 https://www.chartjs.org/ 왼쪽의 사이드바에서 쓰고 싶은 차트를 선택 Vertical Bar Chart에서 밑의 Sample코드를 복사해서 사용 날씨출력 데이터 가져오기 # jquery 파일을 추가합니다 Chart.min.js 파일과 utils.js 파일은 첨부 날씨출력 데이터 가져오기 1. 날씨데이터 가지고 오기 => ex01movie.html 참고 http://api.openweathermap.org/data/2.5/weather?q=seoul&appid=1eb1d18602c0e2dde562cdc2005a4495&units=metric 2. console 창에 현재 기온, 최고 기온, 최저 기온을 가지고 올것 현재 기온 temp, 최고 기온 tem.. 2023. 10. 24. Jquery(제이쿼리) 오픈API, Ajax방식으로 데이터를 요청해 json데이터 추출(영화, 지도) ● Ajax란? ※ 오픈 API 사용하는 방법 1. 회원가입 2. 내가 필요한 API가 뭔지 찾기 3. 샘플코드 보기 (맨 위 OR 맨 아래) 4. ★★★★★ Key신청하기 5. 샘플코드 뜯어보고 수정하기 6. 모르는 내용은 문서확인하기 7. Url 테스트 8. 코드 개발 시작 http://127.0.0.1:5500 인증키: 709950ed56fb6243b4b795fb49640262 https://kobis.or.kr/kobisopenapi/webservice/rest/boxoffice/searchWeeklyBoxOfficeList.json?key=709950ed56fb6243b4b795fb49640262&targetDt=20211128 ● 영화 데이터 추출 https://www.kobis.. 2023. 10. 24. 이전 1 2 다음 반응형