생각기록
생활 코딩 WEB2 JavaScript 1 본문
웹화면, 우클릭 > 검사
Elements = 태그
input type = "button" value="night" onclick="
document.querySeletor('body').style.backgroundColor='black';
document.querySeletor('body').style.Color='white';
버튼 타입인
버튼이름값이 night인
onclick이라는 속성의 값은 JavaScript가 와야한다.
사용자가 onclick속성이 위치한 버튼을 클릭했을 때,
이 js코드를 실행시킬 것
document.querySeletor('body').style.backgroundColor='black';
document. 해당 웹문서
('body') 바디태그 = 화면 전체
.style. 스타일 속성값으로
backgroundColor='black'; 배경색을 블랙으로 한다.
문법을 이해 x
한국말을 이해 o
style 속성값으로는 반드시 css가 온다.
1. 자바스크립트는 사용자와 상호작용 하는 언어이다.
2. 웹브라우저는 한번 화면에 출력되면, 바꿀 수 없다 = body태그는 언제나 body태그임
3. 자바스크립트가 html을 제어하는 언어이다. (동적으로)
자바스크립트 <script>태그 쓴다.
<body>
<h1>html</h1>
1+1
<h1>JavaScript</h1>
</body>
<script>
document.write(1+1);
</script>js와 html
html은 정적이다 1+1을 그대로 출력
js는 동적이다 1+1 = 2로 출력
js의 이벤트
<input type="button" value="hi" onclick="alert('hi')">
<input type="text" onchange="alert('changed')"><br>
<input type="text" onkeydown="alert('key down')">위에서
alert('https://www.youtube.com/watch?v=-VKIqaEdDVU&list=PLuHgQVnccGMBB348PWRN0fREzYcYgFybf&index=5'. length)
문자를 ' ' 로 묶어준다.
문자열의 문자의 갯수를 알려주는 명령어 > .length
tip.
1. elements 에서 esc누르면, console 창을 껏다 켜기 가능
2. 한번 실행했던 코드는 화살표 ↑키를 누르면 다시 화면에 나타난다.
3. 콘솔을 통해 js를 실행하면, 현재 보고있는 웹페이지를 통해 js 실행
데이터타입 - 문자열과 숫자
데이터타입 = 자료형
콘솔을 계산기처럼 사용할 떄
일일이 alert하는 것도 귀찮다.
1+1 = 2
2-1 = 1
2*4 = 8
6/2 = 3
연산자 + 는 좌항 우항을 더해서 하나의 값을 만든다 = 이항 연산자 = 산술 연산자
문자는 "hello warld" 'hello warld' 따옴표로 묶는다.
String 검색, 모질라에서 운영하는 페이지 참고
https://developer.mozilla.org/ko/docs/Web/JavaScript/Data_structures
JavaScript의 타입과 자료구조 - JavaScript | MDN
모든 프로그래밍 언어에는 내장된 자료구조가 존재하지만 보통 그 내용은 언어마다 다릅니다. 이 글에서는 JavaScript에서 사용할 수 있는 내장 자료구조와 그 속성에 대해 알아보겠습니다. 그러
developer.mozilla.org
String-length 사용법등을 참고하면 된다.
console.log('alphabet'.toUpperCase()); // 'ALPHABET'
문자열을 쓰고 .toUpperCase()하면, 결과가 대문자 알파벳이 된다.
indexof우리가 찾으려는 값을 넣으라
.trim()
공백을 없애준다.
우리가 데이터 타입을 잘 구분해야 하는 이유
문자 '1'과 숫자 1은 다르다
Number
변수와 대입 연산자
x = 1 ;
x : 변수 variable
= : 대입 연산자
1 : 값
대입연산자란?
오른쪽 항의 값을 왼쪽의 변수에 대입한다
좌항 우항을 결합해서 우항의 값을 만들어 낸다는 특징도 있다.
> x라는 변수는 대입연산자를 통해 언제든지 값이 바뀔 수 있다.
변수는 언제든지 변할 수 있는 수 = '변수'
1은 2가 될 수 없다.
항상 변하지 않는 수 = '항수'
variable vs constant
'강의 정리 > 생활 코딩 강의 정리' 카테고리의 다른 글
| 생활 코딩 WEB2 파일 쪼개서 정리 정돈 (0) | 2022.11.12 |
|---|---|
| 생활 코딩 WEB2 JavaScript 5 (0) | 2022.11.11 |
| 생활 코딩 WEB2 JavaScript 4 (0) | 2022.11.11 |
| 생활 코딩 WEB2 JavaScript 3 (0) | 2022.11.09 |
| 생활 코딩 WEB2 JavaScript 2 (0) | 2022.11.09 |
