일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | |
7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 | 30 | 31 |
- setItem
- 탑다운
- 웹스크래핑
- 자주 사용하는 Quaternion 함수
- intervals
- Event
- vsCode
- addEventListener
- click
- Quaternion
- topdown
- 연습
- Unity
- getItem
- wsl
- 픽셀
- 도린이
- 코딩
- jQuery
- 회전
- classList
- 2D
- 독립변수
- euler
- 도트
- 종속변수
- Lerp
- PYTHON
- javascript
- className
- Today
- Total
목록전체 글 (86)
쫑가 과정
명언만들기 명언을 넣은 array를 만들어준다. const saying = [ {a : "유행은 유행에 뒤떨어질 수 밖에 없게 만들어진다.", b : "가브리엘(코코)샤넬"}, {a: "미래는 탁한 거울이다. 누구든 들여다 보려 하면 늙고 근심 어린 얼굴의 희미한 윤곽만 볼 뿐이다.", b: "짐 비숍" }, {a: "현재뿐 아니라 미래까지 걱정한다면 인생은 살 가치가 없을 것이다.", b: "윌리엄 서머셋 모옴"}, {a: "일 분 전만큼 먼 시간은 없다.", b: "짐 비숍"}, {a: "당신은 지체할 수도 있지만 시간은 그러하지 않을 것이다.", b: "벤자민 프랭클린"}, {a: "미래에 사로잡혀있으면 현재를 있는 그대로 볼 수 없을 뿐 아니라 과거까지 재구성하려 들게 된다.", b: "에릭 호퍼..
목표 input 입력값을 화면에 띄워보자. 작동원리 파악 form, input 만들기. submit한 후에 form이 사라진다. 입력값이 저장되고 꺼내 쓸 수 있다. 1. submit 후 form 숨기기 form 숨기기 See the Pen by jongha (@gajong) on CodePen. submit하면 form은 사라졌지만 사용자 이름이 console에는 기록됐다. h1태그 숨기기 현재 h1은 공백으로 나와있는 것이라 처음에 hidden으로 숨겨놓아야 한다. h1 class를 hidden으로 지정하고 id를 greeting으로 한다. See the Pen by jongha (@gajong) on CodePen. h1을 JavaScript에서 사용할 수 있게 변수로 만들어준다. submit이 작..
사용자 이름 저장하기 (local storage) Window.localStorage - Web API | MDN localStorage 읽기 전용 속성을 사용하면 Document 출처의 Storage 객체에 접근할 수 있습니다. 저장한 데이터는 브라우저 세션 간에 공유됩니다. developer.mozilla.org 브라우저에서 공짜로 뭔가를 기억할 수 있게 해주는 api이다. 예를 들어 유튜브 볼륨을 조절하고 기억하는 기능 등이다. 자주 사용한다. localStorage console에 localStorage라고 입력하면 볼 수 있는데 이미 정의되어 있다. 또 개발자 도구(f12)에서 볼 수 있다. application > local storage 이곳에 저장했다 꺼내 쓸 수 있다. localStora..
string과 veriable 조합 1. template strings + 를 이용해서 string을 조합하는 방식 +와 띄어쓰기를 기억해야 한다. userName.innerText = "hello " + username; 2. Template_literals Template literals - JavaScript | MDN 템플릿 리터럴은 내장된 표현식을 허용하는 문자열 리터럴입니다. 여러 줄로 이뤄진 문자열과 문자 보간기능을 사용할 수 있습니다. 이전 버전의 ES2015사양 명세에서는 "template strings" (템플릿 문 developer.mozilla.org ``(백틱)을 이용하는 방법이 있다. 일반 키보드 tap키 위에 있는 ~과 함께 있는 기호다. `` 안에 ${변수명}만 넣으면 된다...
preventDefalut() preventDefault는 어떤 event의 기본 행동이든지 발생되지 않도록 막는 거다. event.preventDefault(); 기본 행동이란 어떤 function에 대해 브라우저가 기본적으로 수행하는 동작. form은 submit 하면 브라우저는 기본적으로 페이지를 새로고침 하도록 되어있다. 예시 하나 더 HTML에 a 태그를 추가해서 링크로 이동하지 않게 해 보자. google.com anchor(link)의 기본 동작은 클릭 시 다른 페이지로 이동하는 것이다. 클릭시 알람이 뜨는 event를 작성해보면 const link = document.querySelector("a") function clicklink() { alert("Don't go link!") } l..
function Afunction(a) { console.log('hi ' + a); } Afunction("Dalbong") function은 ()로 실행하고 그 안의 정보를 argument가 받아온다. function onLoginSubmit() { console.log(loginInput.value); } loginForm.addEventListener("submit", onLoginSubmit) 현재는 argument를 사용하고 있지 않다. addEventListener를 활용할 때 argument가 있다면 어떤 정보를 받아올까? const loginForm = document.querySelector("#login-form") const loginInput = document.querySelec..
HTML 요소는 웹 기반 양식에서 사용자의 데이터를 받을 수 있는 대화형 컨트롤을 생성한다. 입력 유형과 특성의 다양한 조합 가능성으로 인해, 요소는 HTML에서 제일 강력하고 복잡한 요소 중 하나이다. input 유형 : 입력 요소 - HTML: Hypertext Markup Language | MDN HTML 요소는 웹 기반 양식에서 사용자의 데이터를 받을 수 있는 대화형 컨트롤을 생성합니다. developer.mozilla.org 요소의 동작 방식은 type 특성에 따라 현격히 달라지므로, 각각의 유형은 별도의 참고 문서에서 더 자세히 확인할 수 있다. 특성을 지정하지 않은 경우, 기본값은 text. See the Pen by jongha (@gajong) on CodePen. input 속성 : ..
목표 element를 click 했을 때 색상이 파란색이 되고 파란 element를 click하면 토마토색이 되게 한다. 작동원리 파악 todo -> click = blue blue todo -> click = tomato click event를 사용. 색상에 따라 만들 수 있는 조건을 확인. 어떤 식으로 작성해야 하는지 보자. See the Pen by jongha (@gajong) on CodePen. console을 보면 click 할 때마다 todo.style.color가 blue로 나오는 것을 확인할 수 있다. 그럼 todo.style.color가 blue이면 tomato가 되게 추가해보자. (작동원리 2번) condition에 따른 작동(if, else) See the Pen by jongha..