다연이네

문제1) 하단의 버튼 클릭시 테이블의 체크박스 전체 선택/해제 문제2) 상단의 체크박스 클릭시 테이블의 체크박스 전체 선택/해제 문제3) 체크 박스에 체크를 한 후 버튼을 누르면 하단에 체크된 사람들의 이름 출력 기본 코드 전체선택 : 1 hong seoul 2 admin seoul 4 kenik pohang 버튼 문제1. 하단의 버튼 클릭시 해당 테이블의 체크박스 전체 선택/해제 문제2. 상단의 체크박스 클릭시 테이블의 체크박스 전체 선택/해제 문제3. 체크 박스에 체크를 한 후 버튼을 누르면 하단에 체크된 사람들의 이름 출력되도록 해라 1. 내가 한 코딩 2. 강사님이 하신 코딩 -parentElement : 태그만 찾는다 -parentNode : 빈공간 등 포함 td마다 id값 줄 수 없고 문자열을..

이벤트 처리 방법 4가지 Click Me 이벤트 전파 방법 1. 이벤트 버블링 자식 -> 부모 이벤트 전달(전파) 2. 이벤트 캡쳐 부모 -> 자식 " 거의 모든 이벤트는 버블링 됩니다. JavaScript addEventListener() Bubbling: Click me! Capturing: Click me! 1번에 해당하는 공간을 클릭하면 [IN] [OUT] 알림 2개가 연달아 뜬다. 2번에 해당하는 공간을 클릭하면 [OUT] 알림만 뜬다. 버블링을 없애고싶다면 ? e.stopPropagation(); 추가 (전파 멈추기) - jQuery document.getElementById("myP1").addEventListener("click", function(e) { alert("IN"); e.sto..

1. js 컬렉션 elements / forms / arguments / options /links / images등등 뒤에s가 붙으면 컬렉션(~의 집합)이라고 생각하자 Name : Age : Email : 확인 form.elements.length 컬렉션의 개수 (버튼 몇개 input 몇개) 2. DOM 1. DOM 정의 : 문서에 엑세스하기 위한 표준을 정의 2. Document Object Model의 약자 3. W3C DOM 종류 ㄱ. Core DOM :모든 문서 유형에 대한 표준 ㄴ. XML DOM :xml문서 ㄷ. HTML DOM :html문서 4. html DOM을 배워서 어디에 사용하냐 ? ㄱ. html 요소에 Access해서 내용 변경 ㄴ. html 요소에 Access해서 스타일 변경 ㄷ..

버튼을 누르면 공이 대각선 방향으로 움직이다가 끝에서 멈춘다. Click Me 공튀기기 코딩 공이 벽에 부딪히면 튀긴다. Click Me 버튼을 누르면 좌측 상단에 있던 공이 움직이기 시작하고, Click make 버튼을 누르면 누를때마다 새로운 공이 생성된다. Click Me Click make

해당 div태그들을 마우스 좌측 버튼을 이용해 드래그(이동)할 수 있다. 컴퓨터 TV 침대 책상 Drag me around 알아두기!! 마우스 관련 이벤트 1. onmouseover : 해당 영역위에 커서가 진입하는 순간 발생 2. onmouseout : 해당 영역에서 커서가 빠져나가는 순간 발생 3. onmousedown : 해당 객체의 영역에서 마우스 버튼이 눌려지는 순간 발생 4. onmouseup : 해당 객체의 영역에서 마우스 버튼이 떼는 순간 발생 5. onmousemove : 해당 객체의 영여겡서 커서가 움직이는 순간 발생 1. clientX, clientY 클라이언트 영역 내의 가로,세로 좌표 제공 (클라이언트 영역 : 현재 보이는 브라우저 화면이 기준이다) clientX : 브라우저 페이..

클로저 == 함수 폐쇄 js는 중첩함수를 지원한다. (함수 안에 함수 만들기) 부모함수가 닫힌 후에도 부모 범위에 접근할 수 있는 함수 + 중첩함수 test 버튼을 누를때마다 카운트가 증가한다. (클로저를 통한 접근) test 버튼을 눌러도 출력값이 1에서 변하지 않는다. 0에서 1증가해서 1이 되고 함수 호출 끝나면 지역변수 제거되고, 다시 호출되면 다시 0에서 1되고,.. 버튼 누를때마다 항상 0->1 되기 때문에 1만 반복되는 것이다. 지역변수는 함수를 호출할때마다 새로 만들어진다. 만약 지역변수도 있고 전역변수도 있다면 ? 그래도 1만 출력된다. => 똑같은 변수가 있다면 지역변수가 우선시 된다. (지역변수 카운터 먼저 쓰고 있다) test 9 출력, 지역변수가 전역변수보다 우선순위가 높다. te..

- 작동하게 하는 함수 setTimeout("실행시킬 함수",시간) : 대기 시간이 지난 후 해당 함수를 한번만 실행시킨다. setInterval("실행시킬 함수",시간) : 대기 시간이 지난 후 해당 함수를 반복해서 실행시킨다. - 작동을 중지시키는 함수 clearTimeout() : setTimeout을 중지 clearInterval() : setInterval을 중지 1버튼을 누르면 아무것도 없던 자리에 날짜와 시간이 뜬다. (1초 단위로 계속 업데이트 됨) 2버튼을 누르면 움직이던 시간이 멈춘다. 1. setTimeout, clearTimeout() 사용 setTimeout clearTimeout 2. setInterval, clearInterval 사용 + jQuery로 변경 setInterva..

call()/apply() 메소드 객체를 매개변수로 사용하여 메소드를 호출하는 함수 위의 person1과 person2에서 이름, 나이 출력하는 print() 메소드가 중복된다. =>이 메소드만을 가지는 객체를 따로 선언하자 이 메소드를 호출하는 방법은 다음과 같다. person.print.call(person1); person.print.apply(person1); 위 상황에는 call과 apply가 같은 결과를 출력한다. 그렇다면 차이점은 무엇일까? 메소드에 자체 매개변수가 있을 경우 call()/apply() 사용에 차이가 있다.