728x90
반응형

querySelector 5

[JAVASCRIPT] 4. 마우스 오버 효과

01 e.preventDefault() a태그 링크를 걸리지만 기본 명령어를 무시하고 원하는 명령어를 넣어보기 e.preventDefault(); 기존 명령어를 삭제함 네이버 02 마우스 오버 효과 ● mouseenter : = mouse hover 박스 핑크로 변했다가 마우스 떼면 아쿠아색으로 바꿔주기 scale 키웠다가 원래 크기로 변경해주기 같은 방법(너비 높이 값 지정) 03 반복된 요소에 이벤트 한꺼번에 연결하기 ● querySelectorAll 요소를 한꺼번에 지정 let : 변하는 값 e.preventDefalut(); 기본으로 갖고있는 명령어를 멈춤 item1 item2 item3 item4 04 클릭이벤트를 발생할 때 증가, 감소하는 프로그램 1씩 증가 1씩 감소 증가 감소 05 박스 돌..

[JAVASCRIPT] 자바스크립트 이벤트 연결하기

● .addEventListener : 이벤트 발생시키는 명령어 ● 화살표 함수 link.addEventListener("click",function(){}); link.addEventListener("click",()=>{}); >> 두가지 방법으로 화살표함수를 넣을 수 있다. a태그가 우선시 되기 때문에 링크를 클릭하셨군요가 안나온다. ● preventDefault: 고유의 명령어를 무시하고 내가 원하는 값을 나오게 해주는 명령어다. a태그 속성값을 무시하고 원하는 값을 출력하게 하는 명령어 [박스 클릭했을 때 색상 변경하는 방법] 클릭이벤트

[JAVASCRIPT]요소 선택하기

자바스크립트는 따로 링크를 걸지 않고 사용할 수 있다. frame 은 section # wrap 안에 있는 article이 들어간 것을 볼 수 있다. querySelector는 하나의 요소를 선택할 수 있다. querySelectorAll 은 여러개의 article을 모두 선택할 수 있다. ● 배열 for() 여러개 복수로 할땐 쿼리셀랙트올 + for문 을 써야 하나하나 방에 값을 뿌려줄 수 있다 querySelectorAll 랑 for문은 세트다 items 아이템이라는 변수에 넣어서 층에 0부터 3번까지 4개의 인데스값을 받으면서 처리한다.

728x90
반응형