본문 바로가기

노마드 코더43

[바닐라JS로 크롬 앱 만들기] DOM - If else - Function practice [출처-유튜브 노마드 코더 Nomad Coders] https://youtu.be/UwnBvuFyiBU -이벤트의 근원을 알고 싶으면 항상 MDN을 찾아보라 const title = document.querySelector("#title"); const BASE_COLOR = "rgb(52, 73, 94)"; const OTHER_COLOR = "#7f8c8d"; function handleClick(){ const currentColor = title.style.color; console.log(currentColor); } function init(){ title.style.color = BASE_COLOR; title.addEventListener("click", handleClick); } ini.. 2021. 2. 26.

[바닐라JS로 크롬 앱 만들기] If, else, and, or [출처-유튜브 노마드 코더 Nomad Coders] https://youtu.be/NUh9afZ5xUs if(10 > 5){ console.log('hi') } else { console.log("ho") } if(10 === 5){ console.log('hi') } else { console.log("ho") } if ("10" === 10){ console.log('hi'); } else if ("10" === "10"){ console.log("lalala"); } else { console.log("ho"); } if (20 > 5 && "nicolas" === "nicolas"){ // 둘 다 참이어야 함 console.log("yes"); } else { console.log("no"); }.. 2021. 2. 26.

[바닐라JS로 크롬 앱 만들기] Events and event handlers [출처-유튜브 노마드 코더 Nomad Coders] https://youtu.be/LnuLDGO5848 -자바스크립트는 HTML과 CSS를 바꾸는 기능을 하지만 이벤트에 반응하기 위해 만들어졌다 -이벤트란 웹사이트에서 발생하는 것들을 말한다. click,resize,submit,input, change, load, before, closing, printing 등등 -window는 조금 다른 이벤트를 가지고 있다 -함수 뒤에 ()를 쓰면 지금 바로 호출하라는 뜻 ()를 쓰지않으면 함수를 바로 즉시 호출하지않음. 매우매우 중요!! const title = document.querySelector("#title"); function handleResize() { console.log("I have been .. 2021. 2. 26.

[바닐라JS로 크롬 앱 만들기] Modifying the DOM with JS [출처-유튜브 노마드 코더 Nomad Coders] https://youtu.be/JscDdICRvgo const title = document.getElementById("title"); title.innerHTML = "Hi! From JS"; console.dir(title); const title = document.getElementById("title"); title.innerHTML = "Hi! From JS"; title.style.color = "red"; console.dir(title); const title = document.getElementById("title"); title.innerHTML = "Hi! From JS"; title.style.color = "red"; con.. 2021. 2. 26.

[바닐라JS로 크롬 앱 만들기] JS DOM Functions [출처-유튜브 노마드 코더 Nomad Coders] https://youtu.be/VBmQUMUGznU -HTML이 자바스크립트와 함께 쓰이려면 어떻게 해야 동작하는지 배울 것 -자바스크립트는 HTML에 있는 모든 요소를 가지고 와서 그것들을 객체로 만들 것이다 const title = document.getElementById("title"); console.log(title); const title = document.getElementById("title"); console.log(title); console.error("Fuck"); 그리고 우리가 찾게될 모든 객체들의 함수는 DOM(Document Object Model)형태로 변경 가능하다 const title = document.getElem.. 2021. 2. 26.

[바닐라JS로 크롬 앱 만들기] More Function Fun [출처-유튜브 노마드 코더 Nomad Coders] https://youtu.be/mLTUtMARkqc -자바스크립트에선 ""도 String이고 ''도 String이다 -``도 사용 가능 function sayHello(name, age){ console.log("Hello " + name + " you are " + age + " years old"); } sayHello("Nicolas", 15); function sayHello(name, age){ console.log(`Hello ${name} you are ${age} years old`); } sayHello("Nicolas", 15); ★ 주의 만일 아래와 같이 코딩하면 function sayHello(name, age){ console.l.. 2021. 2. 26.

이전 1 2 3 4 5 6 7 8 다음

티스토리툴바