javascript5 [javascript] toy project_choromeApp 01 로그인 화면 만들기 const loginForm = document.querySelector("#login-form"); //querySelector를 이용해서 id값을 찾을때는 반드시 id값이라고 따로 명시 해줘야 한다 =#를 붙여야함 //getElementById는 그럴 필요 없음 const loginForm = document.querySelector("#login-form"); const loginInput = loginForm.querySelector("input"); const loginButton = loginForm.querySelector("button"); 위 아래 두 코드는 동일한 결과를 낸다. const loginInput = document.querySelector("#login-.. 2021. 8. 15. [javascript] toggle function handleTitleClick(){ const clickedClass = "clicked"; if( h1.classList.contains(clickedClass)){ h1.classList.remove(clickedClass); } else{ h1.classList.add(clickedClass); } } 이 작업을 굉장히 많이 한다 그래서 사용하는게 toggle function 위의 코드를 아래와 같이 바꾸 수 있다 function handleTitleClick(){ h1.classList.toggle("clicked"); } toggle은 인자로 받은 값이 classlist에 존재하는지 확인하고 있으면 없애고 없으면 더해준다. 2021. 8. 15. [javascript]window event document를 javascript에서 제공하듯 window도 javascript에서 제공한다 function handleWindowResize(){ document.body.style.backgroundColor="tomato"; } window.addEventListener("resize",handleWindowResize); head,body,title은 document.으로 불러올 수 있지만 그 외 나머지는 get함수를 써서 가져 올 수 있다 2021. 8. 13. [javascript] event eventlistener h1 html element mdn https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement HTMLElement - Web APIs | MDN The HTMLElement interface represents any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it. developer.mozilla.org 우리가 사용할 수 있는 이벤트를 ㅂ려면 console.dir(title) on이 붙은 걸 찾으면 된다 *자바스크립트로 style을 바꿀 수 있지만 그건 cs.. 2021. 8. 13. 이전 1 2 다음
