본문 바로가기

반응형

전체 글

(122)
[JavaScript] Ajex 에서 JSON데이터 출력 AJAX -> jQuery에서 비동기 처리를 담당하는 메서드 실시간 반영 ex ) 아이디 중복검사, 네이버지도, ... JSON 데이터와 함께 활용됨 기상관측데이터 -> 프로그램 미세먼지데이터 -> 모듈 JSON JSON은 JavaScript Object Notation의 약자입니다. JSON은 사람이 읽을 수 있는 텍스트 기반의 데이터 교환 표준입니다. 이러한 JSON은 XML의 대안으로서 좀 더 쉽게 데이터를 교환하고 저장하기 위하여 고안되었습니다. 또한, JSON은 텍스트 기반이므로 어떠한 프로그래밍 언어에서도 JSON 데이터를 읽고 사용할 수 있습니다 예제 1) JSON 데이터를 HTML 테이블에 넣어서 출력하기 JSON [ {"name": "홍길동", "score1": 95, "score2": ..
[JavaScript] Swiper 사용법 오픈 API 인 Swiper를 사용하여 슬라이드 구현해보도록 하겠습니다. swiper를 사용하려면 여러 방법이 존재합니다. 저는 별도로 다운로드가 필요없는 cdn 방식을 추천 드립니다. cdn으로 사용하는 방식 실제 swiper js파일을 swiper github에서 다운 받아 삽입하는 방식 npm으로 설치하여 사용하는 방식 https://swiperjs.com/ Swiper - The Most Modern Mobile Touch Slider Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior. swiperjs.com Swiper 사이트 접속 후 G..
[JavaScript] jQuery toggleClass(), trigger() toggleClass() 설정된 클래스명을 해당하는 요소가 가지고 있는지 판단하여 해당 요소가 있으면 이를 제거합니다. 반대로 해당 요소가 없다면 이를 부여하는 매우 유용한 메소드입니다. trigger() 클릭이나 스크롤 이동, 브라우저 사이즈 등등 몇몇의 핸들러가 작동하게 될 경우 브라우저에 이를 알리고 함수를 실행하지만 이런 이벤트 핸들러 없이도 동작이 가능하게 하려면 trigger()메소드가 필요합니다. $('selector').trigger('선택할 이벤트');
[JavaScript] jQuery mouseover(), mouseenter() $("A").mouseover() : A위에 마우스가 올라갔을 때 $("A").mouseenter() : A 안에 마우스가 올라갔을 때 $("A1").append("A2") : A1안에 A2 삽입
[JavaScript] jQuery insertAfter(), insertBefore() insertAfter() - 지정한 요소 뒤에 새로운 요소를 삽입 A.insertAfter(B) – B 뒤에 A를 추가 insertBefore() – 지정한 요소의 시작 부분에 내용을 삽입 A.insertBefore(B) – B 앞에 A를 추가 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 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 광고, 갤러리 *{ margin: 0px; padding: 0px..
[JavaScript] 랜덤으로 돌아가는 주사위 게임 만들기 컴퓨터와 사용자를 나누어 주사위를 돌리게되면 랜덤으로 주사위가 돌아가 승패를 나눠주는 게임을 만들어보자! 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 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 과제- 주사위게임 .dice { text-align: center; } .start { text-align: center; } .user { text-align: center; display: ..
[JavaScript] window객체, history, form
[JavaScript] 이벤트 리스너 이벤트 리스너 란? 이벤트 리스너는 DOM 객체에서 이벤트가 발생할 경우 해당 이벤트 처리 핸들러를 추가할 수 있는 오브젝트이다. 이벤트 리스너를 이용하면 특정 DOM에 위에 말한 Javascirpt 이벤트가 발생할 때 특정 함수를 호출한다. 특정 DOM요소에 이벤트 리스너를 등록할 때는 addEventListener를 사용한다. DOM객체. addEventListener(이벤트명, 실행할 함수명, 옵션) click 이벤트 : 클릭했을 때 이벤트 발생 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 32 33 34 이벤트 리스너 #box{ width: 100px; height: 100px; backgro..

반응형