분류 전체보기 80

event 설정

태그.onclick = 함수이름; 같은역할 태그.addEventListener("click", 함수이름); ->아래 방식으로 이벤트를 넣어주면 .removeEventListener =>으로 이벤트 지울 수 있음 클래스명으로 자바스크립트 변화를 주고싶을때 클래스명 잘 활용하기 태그.classList.contains("클래스명") => ()속 클래스명이 있는지 확인.true / false 반환 태그.classList.add("클래스명") => 원래 할당된 클래스명 + 새로운 ()속 클래스명 추가 태그.classList.remove("클래스명") =>()속 클래스명 제거 ==> 태그.classList.toggle("클래스명") 한줄이면 끝남! ()속 클래스명이 있으면 없애고 없으면 추가하고! CSS에 클래스명..

자바스크립트 2022.09.08

document.getElementBy~ 알아보기

document.getElementBy~ - getElementById("id명") => 해당 id를 가진 요소가 불려짐 console.dir( document.getElementById("id명") ) => 해당 id를 가진 요소의 속성(상세정보)들이 불려짐 *[콘솔 오류메세지] Uncaught TypeError : Cannot set property '@@@' of ~~ null @@@의 값이 null이라 속성을 지정할수 없다. => id명 class명을 바르게 호출했는지 살펴보자. - getElementsByClassName("class명") => 해당 클래스이름을 가진 요소들의 속성이 배열에 담겨져서 불려짐 - getElementsByTagName("태그명") => 해당 태그로 지정된 요소들이 배..

자바스크립트 2022.09.08

CSS 선택자 언급 방법

태그명 {} .클래스명{} #아이디명{} *{} => 모든 요소 다 태그1,태그2 => 태그1과 태그2 둘다 태그1 v 태그2 => 태그1 안에 있는 태그2 ----> 후손 선택자(태그1 하위에 있는 모든 태그2 다 적용. 자식건너뛰기도 가능) 태그1 > 태그2 => 태그1을 부모요소로 갖는 태그2 -----> 위에 것과 무슨차이?? 바로 하위 자식만 콕 지정! 태그1.id명 => 태그1이 여러개일때 그 태그 중에서 id명이 이것인 요소.(설명 구체화 목적) .클래스1.클래스2{} => 클래스1 과 클래스2 둘다 .클래스1 v .클래스2{} =>클래스1 안에 있는 클래스2 그 외의 참조법 https://www.w3schools.com/cssref/css_selectors.asp CSS Selectors ..

생활코딩 2022.09.06

CSS 적용과 선택자 우선순위

CSS 를 따로 사용하게 되면 1) 유지보수가 수월해지고 2) 프로그램의 가독성이 좋아진다. CSS적용방법 1. HTML의 style속성(CSS의 효과를 담고 있음)을 사용. 2. style태그를 사용. CSS적용 우선순위 인라인 스타일 지정(직접지정) > id선택자 > class선택자 > 태그선택자(나중에 선언) > 태그선택자 (초기에 선언) * id는 유일한 고유값이기 때문에 우선 적용 ** 같은 종류의 선택자일 경우, 위치를 더 구체적으로 지정한 CSS가 우선순위를 갖는다.

생활코딩 2022.09.06

분기문 break; continue;

반목문의 내부에 사용되어 반복문의 반복여부를 결정함. break; 자신이 포함된 가장 가까운 반복문을 빠져나가는 구문. 반복문 속의 조건문에서 사용. switch문에서도 사용 가능 *) return; 과 break; 차이점. 자바스크립트의 함수 속의 return은 값의 반환뿐만 아니라 exit의 기능도 하기 때문에 return 과 동시에 함수가 끝남. break;는 반복문만 탈출하고 상위내용 이어서 진행 continue; 반복문 안(의 조건문)에서만 사용가능한 구문. 반복문 실행 중 continue 아래 부분은 실행하지 않고 반복문 다시 실행. for문 안에 있을때는 증감식으로 이동. while문 안에 있을 때는 조건식으로 이동. ( -> 그래서 증감식을 continue 전에 기재함.) 증감은 하고싶지만..

자바스크립트 2022.09.01

<button>에 type="button"을 쓰는 이유

이것은버튼 타입=버튼 임을 왜 기재해야하나 너무 잘 정리해 둔 글을 발견했다 https://nykim.work/96 버튼에 타입을 쓰는 이유 (button type="button") 프롤로그 가끔 이렇게 type을 명시한 버튼을 마주칠 때가 있는데 전 항상 궁금하더라구요. "아니 버튼이면 버튼이지 버튼 타입 버튼은 대체 뭐람" 그러고보면 비슷하게 타입을 명시하는 이라는 nykim.work (다 이해하지는 못했지만) 나중에 다시 보니 완전 이해가 되버렸다 :D 버튼 태그의 디폴트 type값은 button 이 아닌, submit 이기 때문. 단순 버튼인 button 태그에 type="button" 을 명시하지 않으면 form양식이 제출되어 불필요한 새로고침이 일어날 수도 있음. form 태그 안에서 제출용 ..

고군분투 2022.08.31