Math.random 랜덤숫자 활용하기 Math.random() 0~1사이의 랜덤 실수 Math.random()*n 에 - Math.floor 을 적용하면, 0 ~ n-1 까지의 정수 => ( 배열 인덱스에 적용하기 좋음 ) - Math.ceil 을 적용하면, 1 ~ n 까지의 정수 - Math.round를 적용하면, 0 ~ n 까지의 정수 자바스크립트 2022.09.09
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
@media(){} 미디어 쿼리 @media( 브라우저 창크기가 최대/최소: 몇px 일때 ){ 어떤 요소를 어떻게 해라~ } 대표적으로 display : block; border : none; 등등 생활코딩 2022.09.06
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
이 기능을 이 환경에서 사용할 수 있는지 확인하는 사이트 https://caniuse.com/ Can I use... Support tables for HTML5, CSS3, etc caniuse.com 초록색 : 지원 빨강 : 미지원 연두 : 부분지원 카테고리 없음 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
이클립스 콜솔창 한글 깨짐 프로젝트에서 [Run] -> [Run Configurations] 클릭 Common 탭에서 Encoding 설정 확인 UTF-8도 원래는 한글 인코딩 형식을 지원하지만 글씨가 깨진다면 변경이 필요함 ->방법1 : Other 체크 후, MS949 선택 or입력 ->방법2 : Other 체크 후, EUC-KR 선택 or입력 고군분투 2022.08.28