# jquery

21개의 포스트
post-thumbnail

개발일지#4

0. TIL 객체에 아무리 width, margin 줘도 가운데 정렬이 안될 때는, div를 한 번 더 씌워서 style을 입히면 된다 색상 코드 rgba로 투명도를 조절할 수 있음 .addClass / .removeClass 함수와 2중class(?)를 이용하면 탭을

약 12시간 전
·
0개의 댓글

jQuery selector

id 선택자 $("class 선택자 $(".test").hide();tag 선택자$("p").hide();\`attribute 선택자 $("\[href]").hide();table row 선택자 $("tr:odd").hide();

어제
·
0개의 댓글
post-thumbnail

개발일지#2

첫 페이지 구성 ..ㅎ부트스트랩으로 점보트론, nav 넣고,재료고르기 버튼 눌렀을때 nav 보여주도록 했음설정으로 배경 이미지 흐리게색조합: https://flatuicolors.com/ 참조카테고리화: 안하면 페이지가 너무 너무 길어지는데 막 링크 넣고 어쩌

2020년 2월 17일
·
0개의 댓글
post-thumbnail

탭 메뉴 레이아웃 만들기

웹 페이지 제작을 하다보면 탭 메뉴를 이용하여 컨텐츠를 보여주고 숨겨줘야 할 때가 있습니다. 특히 요즘은 대부분의 경우 반응형 웹 페이지를 기본으로 만들기 때문에 PC보다 더 작은 화면의 디바이스로 갈 경우, 한정된 공간 안에서 효율적으로 컨텐츠를 보여주기 위해선 탭

2020년 2월 14일
·
0개의 댓글
post-thumbnail

getJSON으로 Ajax통신하기

제일 잘 설명해놓은 링크가 있어서 첨부한다.https://devbox.tistory.com/entry/jQuery-jQuery%EB%A5%BC-%EC%9D%B4%EC%9A%A9%ED%95%B4-JSON-%EB%8D%B0%EC%9D%B4%ED%84%B0-%EA%

2020년 2월 10일
·
0개의 댓글
post-thumbnail

[jQuery] DOM Ready 방식 vs 모듈 패턴 방식

DOM Ready 방식 vs 모듈 패턴 방식 jQuery의 DOMReady 기능을 이용하여 호출하는 방식과 모듈 패턴을 이용하여 호출하는 방식의 차이점은 아래와 같다. 1. DOM Ready 기능을 이용하여 호출하는 경우 DOM을 불러오기 전까지 이 함수를 호출할 수 없으며 DOM을 조작할 준비가 되면 실행하기 때문에 브라우저에서 최소 한 번 DOM 분...

2020년 2월 4일
·
0개의 댓글

modal is not a function

책 참고해가며 개인프로젝트 진행중에 모달창 띄우는데 .modal is not a function 와 같은 에러가 발생했따 ​ 몇시간을 헤메다가 ​ 구글링 해보니 jquery 중복호출 스크립트 로드 순서의 문제 ​ 이 두가지로 나오는데 일단 1번은 include된 header.jsp에서만 한번 선언하고 jsp나 footer에서 중복선언하지 ...

2020년 2월 1일
·
0개의 댓글

검색 화면 구현시 select태그 사용

검색 화면 구현 부분이다. 실제 구현 하면 아래와 같음 image.png 이해하는데 약간 시간이 걸린 부분이고 놓치기 쉬운 부분이라 기록으로 남김 일단 위 소스의 중점은 페이지가 이동해도 현재 선택한 옵션, 키워드 등이 유지되어야 한다는것이 포인트임 또한 selected키워드를 c:out액션 태그와 함께 어떻게 써야하는지 잘 보여줌 ​ 또한 검...

2020년 2월 1일
·
0개의 댓글

jQuery - each() 메서드

jQuery에는 each()라는 메서드가 있다. each() 메서드는 매개 변수로 받은 것을 사용해 for in 반복문과 같이 배열이나 객체의 요소를 검사할 수 있는 메서드다. 바로 보자. each() 메서드는 다음과 같은 두 가지 타입이 있다. $.each() $.each() 메서드는 object 와 배열 모두에서 사용할 수 있는 일반적인 반복 함수...

2020년 2월 1일
·
0개의 댓글

jQuery? Library?

jquery.PNG 1. Library? - 자주 사용하는 코드들을 재사용할 수 있는 형태로 가공해서 프로그래밍 효율을 높여주는 코드들 2. jQuery? - 엘리먼트를 선택하는 강력한 방법 (ex:Document.getElementById()) - 선택된 엘리먼트들을 효율적으로 제어할수 있는 다양한 수단을 제공하는 "자바스크립트"의 "라이브러리" ...

2020년 1월 30일
·
0개의 댓글
post-thumbnail

[jQuery] 기초 지식 정리하기 #3 - 이벤트/ Ajax/ 다양한 함수

1. 이벤트 이해하기 click : 클릭 이벤트 dblclick : 더블클릭 이벤트 keypress : 키보드 누르면 발생하는 이벤트 이벤트 사용 시 주의 사항 위와 같이 이벤트를 지정한 후, 나중에 동적으로 생성된 태그에는 이벤트가 걸리지 않는다. 이 경우, on을 사용해서 해결할 수 있다. on : $(document).on('event', '...

2020년 1월 28일
·
0개의 댓글
post-thumbnail

[jQuery] 기초 지식 정리하기 #2 - 삽입위치/ 선택자/ 스타일 제어/ Traversing/ Each()

1. HTML 삽입하기 before() : 지정한 태그 바로 직전에 태그가 삽입된다. after() : 지정한 태그 바로 직후에 태그가 삽입된다. prepend() : 지정한 태그의 자식 노드 중 제일 첫번째에 삽입된다. append() : 지정한 태그의 자식 노드 중 제일 마지막에 삽입된다. 2. Selector(선택자) 알아보기 ID Select...

2020년 1월 28일
·
0개의 댓글
post-thumbnail

[jQuery] 기초 지식 정리하기 #1 - 태그 선택, 값 가져오고 변경하기

1. 태그 선택하기 - $('selector') jQuery에서는 $('selecto')로 선택자를 지정할 수 있다. 2. 태그 속성과 HTML 값을 확인하고 변경하기 attr() - 태그 속성의 값을 가져오고 변경하기 attr() 사용방법 > $('selector').attr('태그의 속성 key명', '세팅할 value') attr()를 이용해서 값...

2020년 1월 28일
·
0개의 댓글
post-thumbnail

jQuery 기본 지식 정리하기

jQuery란 무엇인가? jQuery란 JavaScript의 생산성을 향상시켜주는 JavaScript 라이브러리이다. 라이브러리란? 자주 사용하는 코드들을 재사용할 수 있는 형태로 가공해서 프로그래밍 효율을 높여주는 코드들이다. jQuery의 특징 Element를 선택하기 쉽게 할 수 있다. 선택된 Element들을 효율적으로 제어할 수 있다. Java...

2020년 1월 27일
·
0개의 댓글

[Ref] HTML/JS: jQuery로 인터랙티브 웹 페이지 만들기

⭐️ 출처: HTML/JS: jQuery로 인터랙티브 웹 페이지 만들기

2020년 1월 21일
·
0개의 댓글

$(this).index()를 javascript로 만들기[JS]

jquery를 쓰다보면 현재 클릭한 요소의 인덱스 값을 구하는 것을 많이 쓰는데 코드로 보면 다음과 같다. 어떻게 구현하는 걸까? 생각해보자. 우선 현재 클릭한 요소의 부모 요소부터 찾아야 할 듯하다. 함수로 만들어 보겠다 이런식으로하면 element의 부모 요소를 찾을 것이다. 그리고 부모 요소 중 element는 몇 번째 자식인지 찾아야 한다. ...

2019년 12월 6일
·
0개의 댓글

IE에서 ajax요청시 cache문제 처리하기[JS]

문제 IE에서의 ajax 요청이 캐싱되는 문제 정확히는 GET방식으로 요청할 때 캐싱되는 문제이다. jQuery에서는 아래의 방식으로 이 문제를 해결한다. jQuery공식 홈페이지를 가보니 이렇게 적혀있다. `cache (default: true, false for dataType 'script' and 'jsonp') Type: Boolean If ...

2019년 12월 6일
·
0개의 댓글

jQuery-slimScroll 사용하기

jQuery-slimScroll은 div 내에서 iframe처럼 내부 스크롤을 제공하는 jQuery 라이브러리이다. slimscroll.PNG npm 설치 js 추가 관련 링크 http://rocha.la/jQuery-slimScroll https://github.com/rochal/jQuery-slimScroll

2019년 9월 23일
·
0개의 댓글

모바일에서 하위 iframe에서 부모창 가로값 가져오기

모바일에서 하위 iframe에서 부모페이지의 width 값을 가져올 때, 실제 width값을 가져오지 못하는 오류가 있다. Chrome에서 개발자 모드로 iframeScreenWidth와 parentScreenWidth를 체크하면 값이 같게 나온다. 하지만, 실제 아이폰에서 alert를 띄어 두 값을 체크하면 다르게 나온다. 그래서 실제 부모 페이지의 wi...

2019년 7월 9일
·
0개의 댓글