0:00:00.718,0:00:06.893
우린 이미 'innerHTML'에 대해서 꽤나 많이 사용해 왔습니다.
0:00:06.893,0:00:08.885
여기에 대해서 빠르게 조금더 보여드리겠습니다
0:00:08.885,0:00:14.021
먼저, 여기 'innerHTML'을 사용한 예제를 봅시다.
0:00:14.021,0:00:17.992
저는 여기에 "all about cats" 라는 string함수를 통해 적어주었습니다.
0:00:17.992,0:00:22.176
하지만, 사실 이 string 함수에 HTML 테그를 넣을수 있습니다
0:00:22.176,0:00:26.565
그러므로 여기 "cat" 부분을 ''테그를 통해 넣을수있고
0:00:26.565,0:00:29.373
보시다 시피 강조된것으로 볼수 있습니다.
0:00:29.373,0:00:32.649
혹은 이 아래에 "dog"를 "cat"으로 변환시킨 부분에
0:00:32.649,0:00:36.152
''테그를 쓸수 있습니다.
0:00:36.152,0:00:39.007
그리고 이는 크고 두껍게 나타납니다.
0:00:39.007,0:00:44.148
또한 ''테그를 넣어서, 혹은 전체 웹페이지의 HTML 을 이곳에 넣어서
0:00:44.148,0:00:47.842
사용할수 있습니다. 정말로 필요한 작업이라면 말이죠.
0:00:47.842,0:00:53.592
꽤나 괜찮아 보입니다. 왜냐하면 이는 'innerHTML'로 많은것을 할수 있다는 뜻이기 때문입니다.
0:00:53.592,0:00:59.072
만약, 문자만을 바꾼다면 'innerHTML'을 사용할 필요는 없습니다.
0:00:59.072,0:01:03.922
우리는 단지 ''textContent'속성만으로 사용할수 있습니다. 그리고 그 말은
0:01:03.922,0:01:09.131
HTML로 쓴것을 브라우저가 인식하지 못하고 단지 일반문자로 만들어주는 것입니다.
0:01:09.131,0:01:12.196
만일 위를 'testContent'로 바꾼다면
0:01:12.196,0:01:14.992
이 괄호들은 더러워 보이게 됩니다!
0:01:14.992,0:01:19.085
그러므로, 이경우에는, 단지 제거해주어야 합니다. 왜냐하면 브라우저가
0:01:19.085,0:01:22.524
실제 HTML로 변화시키는것을 거부하기 때문입니다.
0:01:22.524,0:01:27.121
그러므로 만일 text만을 사용하고 싶으시다면 "textContent'를 사용하시면 됩니다.
0:01:27.121,0:01:31.970
만일 HTML테그나 HTML로 해석되는것 적길 원하신다면
0:01:31.970,0:01:34.750
'innerHTML'을 사용하시면 됩니다.
0:01:34.750,0:01:37.974
DOM 에 대해 더 진보되서 시작하고 싶다면
0:01:37.974,0:01:42.033
'innerHTML'과 'textContent'를 사용하는데 좀더 신경써야 합니다.
0:01:42.033,0:01:44.524
왜냐하면 이들이 또한 요소 내부에 적어둔event listeners를
0:01:44.524,0:01:46.806
제거하기 때문입니다.
0:01:46.806,0:01:48.594
이는 곧 배우게 될 예정입니다.
9:59:59.000,9:59:59.000
다음시간에는 더 정교한 방식을 보여드리도록 하겠습니다.