1. Object (๊ฐ์ฒด) 2. DOM (Document Object Model)2-1. DOM(๋ฌธ์๊ฐ์ฒด๋ชจ๋ธ) ๋ฌธ์๊ฐ์ฒด๋ชจ๋ธ(DOM) HTML CSS JS 2-2. innerHTML vs textContent ์ค๋์ ๋ฌธ์๊ฐ์ฒด๋ชจ๋ธ์ ๋ํด์ ๋ฐฐ์๋ณด์๋ค 2-3. querySelector vs getElementByID์์ฆ์๋ ์ด์ฐจํผ ๋ค ๋ผ์ด๋ธ๋ฌ๋ฆฌ ์ฐ์ง๋ง DOM ํ์ฉํด๋ณด๊ธฐ h1ํ๊ทธ ๋ด์ฉ ๋ณ๊ฒฝ a ํ๊ทธ ์์ฑ ulํ๊ทธ ์์ฑ 2-4. addEventListener ๋๋ฒํผ์ด์ง๋กฑ 2-5. ์์ 1_counting 0 ์ฆ๊ฐ ๊ฐ์ 2-6. ์์ 2_๋ฐ๋ณต๋ฌธ ์ถ๋ ฅ..
# ํ
ํ๋ฆฟ ๋ฆฌํฐ๋ด(Template Literal)ES6๋ถํฐ ์๋ก ๋์
๋ ๋ฌธ์์ด ํ๊ธฐ๋ฒ๋ฌธ์์ด ์์ฑ์ ๋ฐ์ดํ ๋์ , ๋ฐฑํฑ(`)์ ์ฌ์ฉvar str_01 = `hello world`;//๋ฐฑํฑ ์ฌ์ฉconst x='x';const y='y';const z='z';console.log(`${x}๋ x, ${y}๋ y, ${z}๋ z์ด๋ค. `); //x๋ x, y๋ y, z๋ z์ด๋ค. โถ๏ธ ๋ฐฑํฑ(`)์ ์๋ฐ์คํฌ๋ฆฝํธ JS ES6(ECMAScript 2015)๋ถํฐ ๋์
๋์๋ค.โถ๏ธ ๊ฐํ ๋ฌธ์(\n)๋ฅผ ์ฌ์ฉํ์ง ์์๋ ์๋ ์ค๋ฐ๊ฟ โถ๏ธ ์๊น์๊ฐ ์์๋ฐ์ํ(')์ ๋น์ทํ๋ ํท๊ฐ๋ฆฌ์ง ์๋๋ก ์ฃผ์# ํ
ํ๋ฆฟ ๋ฆฌํฐ๋ด - ๋ฐฑํฑ(`)์ ๊ธฐ๋ฅ ์ค๋ฐ๊ฟ(๊ฐํ: Multi-line strings) โถ๏ธ ๋ฐฑํฑ(`)์ผ๋ก ํ
ํ๋ฆฟ ๋ฆฌํฐ๋ด์ ์ฌ์ฉํ๋ฉด..
'ํํ์' ํ๊ทธ์ ๊ธ ๋ชฉ๋ก
๋จ์ถํค
๋ด ๋ธ๋ก๊ทธ
๋ด ๋ธ๋ก๊ทธ - ๊ด๋ฆฌ์ ํ ์ ํ |
Q
Q
|
์ ๊ธ ์ฐ๊ธฐ |
W
W
|
๋ธ๋ก๊ทธ ๊ฒ์๊ธ
๊ธ ์์ (๊ถํ ์๋ ๊ฒฝ์ฐ) |
E
E
|
๋๊ธ ์์ญ์ผ๋ก ์ด๋ |
C
C
|
๋ชจ๋ ์์ญ
์ด ํ์ด์ง์ URL ๋ณต์ฌ |
S
S
|
๋งจ ์๋ก ์ด๋ |
T
T
|
ํฐ์คํ ๋ฆฌ ํ ์ด๋ |
H
H
|
๋จ์ถํค ์๋ด |
Shift + /
โง + /
|
* ๋จ์ถํค๋ ํ๊ธ/์๋ฌธ ๋์๋ฌธ์๋ก ์ด์ฉ ๊ฐ๋ฅํ๋ฉฐ, ํฐ์คํ ๋ฆฌ ๊ธฐ๋ณธ ๋๋ฉ์ธ์์๋ง ๋์ํฉ๋๋ค.