1
00:00:00,000 --> 00:00:04,766
Temos usado bastante <i>innerHTML</i> por aqui,

2
00:00:04,766 --> 00:00:08,893
mas ainda quero mostrar
umas coisinhas sobre ele.

3
00:00:08,893 --> 00:00:14,021
Primeiro, vejamos nosso exemplo,
bem aqui onde definimos <i>innerHTML</i>

4
00:00:14,021 --> 00:00:17,992
Eu acabei de passar numa <i>string</i>
(cadeia de caracteres), "all about cats".

5
00:00:17,992 --> 00:00:22,176
Mas poderia ter colocado <i>tags</i>
HTML dentro da <i>string</i>.

6
00:00:22,176 --> 00:00:26,565
Eu poderia envolver "cats"
com <i>tags</i> ,

7
00:00:26,565 --> 00:00:29,373
e veja que aparece com ênfase.

8
00:00:29,373 --> 00:00:32,649
Ou aqui em baixo, onde 
troco "dog" por "cat",

9
00:00:32,649 --> 00:00:36,152
Eu poderia envolver isto
com <i>tags</i> ,

10
00:00:36,152 --> 00:00:39,007
e ele apareceria aqui destacada, em negrito.

11
00:00:39,007 --> 00:00:44,148
Poderia até escrever uma <i>tag</i> 
bem aqui dentro, ou colocar uma página

12
00:00:44,148 --> 00:00:47,842
HTML inteira aqui, se realmente quisesse.

13
00:00:47,842 --> 00:00:53,592
Isso é bem legal, porque significa que
podemos fazer muita coisa com <i>innerHTML</i>

14
00:00:53,592 --> 00:00:59,072
Se estivermos mudando o texto apenas, 
nem precisamos usar <i>innerHTML</i> .

15
00:00:59,072 --> 00:01:03,922
Podermos usar a propriedade <i>textContent</i>,
que faz com que o navegador

16
00:01:03,922 --> 00:01:09,131
não interprete o que foi passado
como HTML e renderize como texto simples.

17
00:01:09,131 --> 00:01:12,196
Perceba que se mudo isso
para <i>textContent</i>,

18
00:01:12,196 --> 00:01:14,992
meus colchetes aparecem-- eca!

19
00:01:14,992 --> 00:01:19,085
Neste caso, vamos nos livrar
deles, porque o navegador

20
00:01:19,085 --> 00:01:22,524
se recusa a transformá-los 
em HTML.

21
00:01:22,524 --> 00:01:27,121
Então... se quiser apenas definir o texto,
use apenas <i>textContent</i>.

22
00:01:27,121 --> 00:01:31,970
Se quiser passar algumas <i>tags HTML</i>,
e tê-las interpretadas como HTML,

23
00:01:31,970 --> 00:01:34,750
então use <i>innerHTML</i>.

24
00:01:34,750 --> 00:01:37,974
Quando começar a fazer
manipulações DOM avançadas,

25
00:01:37,974 --> 00:01:41,793
terá que tomar mais cuidado em
usar <i>innerHTML</i> e <i>textContent</i>,

26
00:01:41,793 --> 00:01:44,764
porque eles removerão também
ouvintes de evento

27
00:01:44,764 --> 00:01:46,806
que você anexou aos
elementos,

28
00:01:46,806 --> 00:01:48,594
algo que aprenderá logo
a fazer.

29
00:01:48,594 --> 00:01:52,033
No próximo vídeo, mostrarei um
jeito mais sofisticado

30
00:01:52,033 --> 00:01:54,672
de inserir elementos novos e
texto na sua página.

31
00:01:54,672 --> 00:02:00,032
Legendado por [Fred Guth] Revisado por [Valter Bigeli]