일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- 코딩
- Lerp
- PYTHON
- 픽셀
- 독립변수
- 회전
- wsl
- 자주 사용하는 Quaternion 함수
- topdown
- vsCode
- setItem
- 웹스크래핑
- click
- classList
- getItem
- 도트
- 연습
- intervals
- 종속변수
- Unity
- className
- jQuery
- 탑다운
- 2D
- Event
- addEventListener
- euler
- Quaternion
- javascript
- 도린이
- Today
- Total
목록JavaScript/공부 (21)
쫑가 과정
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 속성 : ..
데이터 받기 사용자의 데이터를 받을 수 있는 대화형 컨트롤을 생성한다. : 입력 요소 - HTML: Hypertext Markup Language | MDN HTML 요소는 웹 기반 양식에서 사용자의 데이터를 받을 수 있는 대화형 컨트롤을 생성합니다. developer.mozilla.org See the Pen by jongha (@gajong) on CodePen. 아무거나 입력해서 제출하고 console.dir을 살펴보면 입력값이 value 부분에 적혀있다. input value value부분이 내가 입력한 값이다. const loginInput = document.querySelector("#login-form input"); const loginButton = document.querySelect..
className 특정 엘리먼트의 클래스 속성의 값을 가져오거나 설정할 수 있다. Element.className - Web API | MDN className 특정 엘리먼트의 클래스 속성의 값을 가져오거나 설정할 수 있다. developer.mozilla.org 구조 var cName = elementNodeReference.className; elementNodeReference.className = cName; 예제 let elm = document.getElementById('item'); if(elm.className === 'active'){ elm.className = 'inactive'; } else { elm.className = 'active'; } 풀이) id=item을 변수 elm로..
이벤트 입문 - Web 개발 학습하기 | MDN 이벤트(event)란 당신이 프로그래밍하고 있는 시스템에서 일어나는 사건(action) 혹은 발생(occurrence)인데, 이는 당신이 원한다면 그것들에 어떠한 방식으로 응답할 수 있도록 시스템이 말해주는 것 developer.mozilla.org 무언가를 프로그래밍하고 있는 시스템에서 무언가 발생하는 거다. 예를 들어 글자를 마우스로 클릭했을 때 글자 색상이 변하는 식이다. event 종류 찾아보기. 1. mdn Event reference | MDN This topic provides an index to the main sorts of events you might be interested in (animation, clipboard, workers..
Document 살펴보기 document가 모든 것들의 시작점이고 web site를 의미한다. browser는 Html로 이루어져 있는데 JavaScript를 이용해 Html을 불러올 수 있다. console.log(document); console에 document를 입력하면 내가 Html을 볼 수가 있다. 이건 javaScript로 Html을 불러올 수 있다는 것이다. console.dir(document); 그저 object일 뿐인 항목들이 많이 나온다. 그중에 title: 이라고 적힌 부분을 보자. title항목은 JavaScript에서 title을 정의한 적이 없고 HTML에서 정의한 항목인데 불러올 수가 있다. Html을 JavaScript의 관점으로 보여준 건데. 이것이 object로 보인다..