목록Event (3)

호다닥

Javascript Event - Codeit(Javascript로 배우는 '인터랙티브 웹')

Event (이벤트) HTML 요소들에게 일어날 수 있는 일들 사용자가 요소를 클릭한다 마우스가 요소 위로 올라온다. 마우스가 요소 밖으로 나간다. 페이지 로딩이 끝난다. 사용자가 키보드를 누른다. 이런 이벤트가 일어났을 때 어떤 동작들이 일어나도록 할 수 있는데, 이런 동작을 가능하게 하는 것이 Event Handling 이다. 사용예시1 사용예시2 HTML 부분에는 Javascript 코드를 최대한 적게 넣어야 코드가 깔끔해보인다. 사용예시의 코드들을 아래처럼 작성하면 좀 더 깔끔해보인다. jQuery vs 순수 자바스크립트 이벤트를 등록하는 jQuery 코드의 예시는 아래와 같다. $('#home').on('click', clickHome); $('#seoul').on('click', clickSe..
Javascript 2018. 10. 2. 16:00
자바스크립트 DOM / Event - Udemy(부트스트랩4와 함께하는~)

DOM (Document Object Model) : 자바스크립트로 웹 페이지를 제어하도록 해준다. document.getElementsByTagName() : 태그 이름으로 요소 찾기 document.querySelector() : 선택자 이름으로 요소 찾기 document.getElementsByClassName() : 클래스 이름으로 요소 찾기 document.getElementsById() : ID 이름으로 요소 찾기 → h1 태그를 가진 모든 요소들을 배열형태로 담은 다음 0번째 인덱스의 요소를 temp 변수에 넣는다. Event 이벤트는 웹페이지에서 사용자가 행한 행위에 반응하는 것을 의미한다. 일반적으로 빠르게 이벤트를 적용할 때는 인라인(inline) 방식을 사용한다. 체계적으로 이벤트 처..
Javascript 2018. 9. 22. 13:50
Day3, 4. Event

.querySelectorAll → 유사배열을 호출한다. 따라서 loop을 돌릴 수 있고, 인덱스로 호출할 수도 있다. .parentElement → 부모 Element를 호출할 수 있다..children → 자식 Element를 호출할 수 있다. .setAttribute → 속성을 설정하는 것..getAttribute → 해당 속성에 대한 값을 읽어오는 것이다. dataset : date- 으로 시작하는 속성들에 대한 정보가 담겨있는 객체 모든 Element에는 style이라는 property가 있다. style은 CSS 정보가 들어있고, 자바스크립트를 이용해서 수정할 수 있다. Camelcase : 자바스크립트에서 사용Snakecase : css에서 사용 setTImeout (함수, 시간)두 번째 인..
바닐라코딩 2018. 5. 29. 21:46
Prev 1 Next