본문 바로가기
반응형

개발 공부111

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.
윈도우 시스템 다크 모드로 변경/해제 하는 법 윈도우창 시스템 다크 모드로 변경/해제 하는 법 1. 바탕화면에서 개인 설정을 누른다. 2. 개인설정 메뉴에서 색을 누른다. 3. 모드 선택에서 다크를 누른다. 4. 쉽게 윈도우의 모든 창들이 다크 모드로 변한 것을 볼 수 있다. 2023. 11. 24.
NVM 설치 및 버전 변경 방법 NVM 설치 및 버전 변경 방법 프로젝트의 환경설정을 하다가 보면 Node.js의 버전이 달라서 Node.js를 다시 지우고 다시 그 버전에 맞는 Node.js를 다시 설치해야하나 하고 생각 할 수도 있다. 그래서 Node.js의 버전을 쉽게 바꿀수 있는 NVM이 있다. NVM은 node version manager라고 하는데 NVM을 통해 쉽게 원하는 버전을 설치, 변경 할 수 있다. 1. NVM 설치 https://github.com/coreybutler/nvm-windows/ GitHub - coreybutler/nvm-windows: A node.js version management utility for Windows. Ironically written in Go. A node.js versio.. 2023. 11. 24.
Ajax 사용 - Ajax 메소드 $.ajax() $.get() $.post() .load() Ajax 사용 - Ajax 메소드 $.ajax() $.get() .load() Ajax 메소드 메소드 설명 $.ajax() 비동기식 Ajax를 이용하여 HTTP 요청을 전송함. $.get() 전달받은 주소로 GET 방식의 HTTP 요청을 전송함. $.post() 전달받은 주소로 POST 방식의 HTTP 요청을 전송함. $.getScript() 웹 페이지에 스크립트를 추가함. $.getJSON() 전달받은 주소로 GET 방식의 HTTP 요청을 전송하여, 응답으로 JSON 파일을 전송받음. .load() 서버에서 데이터를 읽은 후, 읽어 들인 HTML 코드를 선택한 요소에 배치함. $.ajax() 메소드 jQuery는 Ajax와 관련된 다양하고 편리한 많은 메소드를 제공한다. 그중에서도 $.ajax() 메소.. 2023. 11. 24.
element 요소 조작 (append, prepend, before, after, parent) Element 요소 조작 (append, prepend, before, after, parent) 기존 요소의 내부에 추가 .append() 선택된 요소의 마지막에 새로운 요소나 콘텐츠를 추가한다 .prepend() 선택된 요소의 첫번째에 새로운 요소나 콘텐츠를 추가한다 .appendTo() 선택된 요소를 해당 요소의 마지막에 추가한다. .prependTo() 선택된 요소를 해당 요소의 첫번째에 추가한다. ​ 기존 요소의 외부에 추가 .before() 선택한 요소의 바로 앞쪽에 새로운 요소나 콘텐츠를 추가한다. .after() 선택한 요소의 바로 뒤쪽에 새로운 요소나 콘텐츠를 추가한다. .insertBefore() 선택한 요소를 해당 요소의 앞쪽에 추가한다. .insertAfter() 선택한 요소를 해당.. 2023. 11. 24.
반응형