1
00:00:00,718 --> 00:00:06,893
우린 이미 'innerHTML'에 대해서 꽤나 많이 사용해 왔습니다.
2
00:00:06,893 --> 00:00:08,885
여기에 대해서 빠르게 조금더 보여드리겠습니다
3
00:00:08,885 --> 00:00:14,021
먼저, 여기 'innerHTML'을 사용한 예제를 봅시다.
4
00:00:14,021 --> 00:00:17,992
저는 여기에 "all about cats" 라는 string함수를 통해 적어주었습니다.
5
00:00:17,992 --> 00:00:22,176
하지만, 사실 이 string 함수에 HTML 테그를 넣을수 있습니다
6
00:00:22,176 --> 00:00:26,565
그러므로 여기 "cat" 부분을 ''테그를 통해 넣을수있고
7
00:00:26,565 --> 00:00:29,373
보시다 시피 강조된것으로 볼수 있습니다.
8
00:00:29,373 --> 00:00:32,649
혹은 이 아래에 "dog"를 "cat"으로 변환시킨 부분에
9
00:00:32,649 --> 00:00:36,152
''테그를 쓸수 있습니다.
10
00:00:36,152 --> 00:00:39,007
그리고 이는 크고 두껍게 나타납니다.
11
00:00:39,007 --> 00:00:44,148
또한 ''테그를 넣어서, 혹은 전체 웹페이지의 HTML 을 이곳에 넣어서
12
00:00:44,148 --> 00:00:47,842
사용할수 있습니다. 정말로 필요한 작업이라면 말이죠.
13
00:00:47,842 --> 00:00:53,592
꽤나 괜찮아 보입니다. 왜냐하면 이는 'innerHTML'로 많은것을 할수 있다는 뜻이기 때문입니다.
14
00:00:53,592 --> 00:00:59,072
만약, 문자만을 바꾼다면 'innerHTML'을 사용할 필요는 없습니다.
15
00:00:59,072 --> 00:01:03,922
우리는 단지 ''textContent'속성만으로 사용할수 있습니다. 그리고 그 말은
16
00:01:03,922 --> 00:01:09,131
HTML로 쓴것을 브라우저가 인식하지 못하고 단지 일반문자로 만들어주는 것입니다.
17
00:01:09,131 --> 00:01:12,196
만일 위를 'testContent'로 바꾼다면
18
00:01:12,196 --> 00:01:14,992
이 괄호들은 더러워 보이게 됩니다!
19
00:01:14,992 --> 00:01:19,085
그러므로, 이경우에는, 단지 제거해주어야 합니다. 왜냐하면 브라우저가
20
00:01:19,085 --> 00:01:22,524
실제 HTML로 변화시키는것을 거부하기 때문입니다.
21
00:01:22,524 --> 00:01:27,121
그러므로 만일 text만을 사용하고 싶으시다면 "textContent'를 사용하시면 됩니다.
22
00:01:27,121 --> 00:01:31,970
만일 HTML테그나 HTML로 해석되는것 적길 원하신다면
23
00:01:31,970 --> 00:01:34,750
'innerHTML'을 사용하시면 됩니다.
24
00:01:34,750 --> 00:01:37,974
DOM 에 대해 더 진보되서 시작하고 싶다면
25
00:01:37,974 --> 00:01:42,033
'innerHTML'과 'textContent'를 사용하는데 좀더 신경써야 합니다.
26
00:01:42,033 --> 00:01:44,524
왜냐하면 이들이 또한 요소 내부에 적어둔event listeners를
27
00:01:44,524 --> 00:01:46,806
제거하기 때문입니다.
28
00:01:46,806 --> 00:01:48,594
이는 곧 배우게 될 예정입니다.
29
99:59:59,999 --> 99:59:59,999
다음시간에는 더 정교한 방식을 보여드리도록 하겠습니다.