[Script Info]
Title: 
[Events]
Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
Dialogue: 0,0:00:00.00,0:00:04.77,Default,,0000,0000,0000,,Temos usado bastante {\i1}innerHTML{\i0} por aqui,
Dialogue: 0,0:00:04.77,0:00:08.89,Default,,0000,0000,0000,,mas ainda quero mostrar\Numas coisinhas sobre ele.
Dialogue: 0,0:00:08.89,0:00:14.02,Default,,0000,0000,0000,,Primeiro, vejamos nosso exemplo,\Nbem aqui onde definimos {\i1}innerHTML{\i0}
Dialogue: 0,0:00:14.02,0:00:17.99,Default,,0000,0000,0000,,Eu acabei de passar numa {\i1}string{\i0}\N(cadeia de caracteres), "all about cats".
Dialogue: 0,0:00:17.99,0:00:22.18,Default,,0000,0000,0000,,Mas poderia ter colocado {\i1}tags{\i0}\NHTML dentro da {\i1}string{\i0}.
Dialogue: 0,0:00:22.18,0:00:26.56,Default,,0000,0000,0000,,Eu poderia envolver "cats"\Ncom {\i1}tags{\i0} ,
Dialogue: 0,0:00:26.56,0:00:29.37,Default,,0000,0000,0000,,e veja que aparece com ênfase.
Dialogue: 0,0:00:29.37,0:00:32.65,Default,,0000,0000,0000,,Ou aqui em baixo, onde \Ntroco "dog" por "cat",
Dialogue: 0,0:00:32.65,0:00:36.15,Default,,0000,0000,0000,,Eu poderia envolver isto\Ncom {\i1}tags{\i0} ,
Dialogue: 0,0:00:36.15,0:00:39.01,Default,,0000,0000,0000,,e ele apareceria aqui destacada, em negrito.
Dialogue: 0,0:00:39.01,0:00:44.15,Default,,0000,0000,0000,,Poderia até escrever uma {\i1}tag{\i0} \Nbem aqui dentro, ou colocar uma página
Dialogue: 0,0:00:44.15,0:00:47.84,Default,,0000,0000,0000,,HTML inteira aqui, se realmente quisesse.
Dialogue: 0,0:00:47.84,0:00:53.59,Default,,0000,0000,0000,,Isso é bem legal, porque significa que\Npodemos fazer muita coisa com {\i1}innerHTML{\i0}
Dialogue: 0,0:00:53.59,0:00:59.07,Default,,0000,0000,0000,,Se estivermos mudando o texto apenas, \Nnem precisamos usar {\i1}innerHTML{\i0} .
Dialogue: 0,0:00:59.07,0:01:03.92,Default,,0000,0000,0000,,Podermos usar a propriedade {\i1}textContent{\i0},\Nque faz com que o navegador
Dialogue: 0,0:01:03.92,0:01:09.13,Default,,0000,0000,0000,,não interprete o que foi passado\Ncomo HTML e renderize como texto simples.
Dialogue: 0,0:01:09.13,0:01:12.20,Default,,0000,0000,0000,,Perceba que se mudo isso\Npara {\i1}textContent{\i0},
Dialogue: 0,0:01:12.20,0:01:14.99,Default,,0000,0000,0000,,meus colchetes aparecem-- eca!
Dialogue: 0,0:01:14.99,0:01:19.08,Default,,0000,0000,0000,,Neste caso, vamos nos livrar\Ndeles, porque o navegador
Dialogue: 0,0:01:19.08,0:01:22.52,Default,,0000,0000,0000,,se recusa a transformá-los \Nem HTML.
Dialogue: 0,0:01:22.52,0:01:27.12,Default,,0000,0000,0000,,Então... se quiser apenas definir o texto,\Nuse apenas {\i1}textContent{\i0}.
Dialogue: 0,0:01:27.12,0:01:31.97,Default,,0000,0000,0000,,Se quiser passar algumas {\i1}tags HTML{\i0},\Ne tê-las interpretadas como HTML,
Dialogue: 0,0:01:31.97,0:01:34.75,Default,,0000,0000,0000,,então use {\i1}innerHTML{\i0}.
Dialogue: 0,0:01:34.75,0:01:37.97,Default,,0000,0000,0000,,Quando começar a fazer\Nmanipulações DOM avançadas,
Dialogue: 0,0:01:37.97,0:01:41.79,Default,,0000,0000,0000,,terá que tomar mais cuidado em\Nusar {\i1}innerHTML{\i0} e {\i1}textContent{\i0},
Dialogue: 0,0:01:41.79,0:01:44.76,Default,,0000,0000,0000,,porque eles removerão também\Nouvintes de evento
Dialogue: 0,0:01:44.76,0:01:46.81,Default,,0000,0000,0000,,que você anexou aos\Nelementos,
Dialogue: 0,0:01:46.81,0:01:48.59,Default,,0000,0000,0000,,algo que aprenderá logo\Na fazer.
Dialogue: 0,0:01:48.59,0:01:52.03,Default,,0000,0000,0000,,No próximo vídeo, mostrarei um\Njeito mais sofisticado
Dialogue: 0,0:01:52.03,0:01:54.67,Default,,0000,0000,0000,,de inserir elementos novos e\Ntexto na sua página.
Dialogue: 0,0:01:54.67,0:02:00.03,Default,,0000,0000,0000,,Legendado por [Fred Guth] Revisado por [Valter Bigeli]