목록분류 전체보기 (198)
Wanna be Brilliant Full-Stack Developer
목표 자바 자료형에 대해서 개념 이해를 해보자! 자료형을 배우기에 앞서 어떤 프로그램을 만들거냐면 과일 장사를 해볼것이다. 과일 장사를 하기위해서 과일을 보관할 창고 설계를 할것이다. 창고 설계를 끝나면 과일 장사를 시작할것인데 과일장사를 하기위해 창고 설계를 할것인데 창고는 단순하게 큰 네모박스에 선이 있고 가로는 5개 세로는 4칸 총 20칸 창고가 있다. 내가 만약에 사과와 딸기가 100개씩 있는데 그냥 넣으면 난잡하게 들어가면 어떤 칸에는 사과가 3개가 들어가고 하나가 들어가고 사과가 반쪽이 들어가는등 문제가 생기니 문제를 방지하기 위해서 사과나 딸기를 담을떄 1) 포장을 해야한다! 한칸을 기준해서 사과를 담아본다 담아보니까 사과가 4개는 안들어가고 3개는 들어가고 공간이 좀남으면 사과를 4개를 못..
목표 class name을 바꾸는 다른방법과 그 방법은 classList를 사용하는인데 한번 익숙해보져봅시다! const h1 = document.querySelector("div.hello:first-child h1"); function handleTitleClick() { const clickedClass = "clicked" if(h1.className ==="clickedClass") { h1.className = ""; }else { h1.className = "clickedClass"; } } h1.addEventListener("click", handleTitleClick); classList는 말 그대로 , 우리가 class들의 목록을 작업할 수 있게끔 허용해준다! element의 clas..
목표 우리는 CSS를 활용해서 Application의 스타일링을 더 잘할 수 있다! style에 적합한 도구는 CSS이고 Animation에 적합한 도구는 JavaScript이다. style.css에서 h1 을 색상을 변경하기 위해서는 h1을 적고 color을 선정해주면된다! body { background-color: beige; } h1 { color: cornflowerblue; } 만약 .active라는 클래스를 생성해서 컬러를 tomato로 선정하게 되면 이 class를 어떤 element에 지정해 주면 ex) h1이던 span이던간에 tomato 색깔을 가지게 될것이다! 이제 자바스크립트에 하고싶은것은 이 h1에 active class를 전달해주고 싶다! const h1 = document.q..
목표 유저가 title을 클릭했을떄 title을 파란색으로 칠해주고 내가 한번더 클릭하면 색깔을 토마토색으로 바꾸고 싶다. const h1 = document.querySelector("div.hello:first-child h1"); function handleTitleClick() { h1.style.color = "blue"; } h1.addEventListener("click", handleTitleClick); 여기서 하고 싶은건 console.log(h1.style.color);을 하여서 만약 h1.style.color가 blue라면 이걸 tomato로 변경해주세요! 만약 h1.style.color 가 blue 색깔이 아니라면 blue로 변경해주세요 라고하는것! const h1 = docume..