1
00:00:00,300 --> 00:00:01,040
Bem vindo de volta.

2
00:00:01,050 --> 00:00:03,240
Neste vídeo vamos pegar onde paramos.

3
00:00:03,240 --> 00:00:07,020
Nós continuaremos falando sobre outras formas de manipular elementos.

4
00:00:07,020 --> 00:00:12,420
Lembre-se de selecioná-los e, em seguida, manipular e, até agora, vimos como podemos alterar a cor ou qualquer

5
00:00:12,420 --> 00:00:17,330
estilo de propriedades e também como podemos usar a lista de classes para afetar o estilo também.

6
00:00:17,640 --> 00:00:22,050
Então, neste vídeo, vamos falar sobre duas propriedades diferentes que nos permitem mudar

7
00:00:22,050 --> 00:00:24,770
o texto ou o idoso em uma página.

8
00:00:24,780 --> 00:00:31,080
ou em vez de uma marca forte, como eu tenho aqui ou para que eu deseje alterar a tag âncora no próprio texto.

9
00:00:31,350 --> 00:00:35,040
Então, se eu quisesse mudar o conteúdo em vez de uma etiqueta H1

10
00:00:35,040 --> 00:00:37,030
Isso é o que vamos ver como fazer neste vídeo.

11
00:00:37,410 --> 00:00:40,590
Então, a primeira propriedade é algo chamado conteúdo de texto.

12
00:00:41,190 --> 00:00:47,430
Como você pode ver aqui, tenho um parágrafo com algum texto e uma etiqueta forte que diz Awesome.

13
00:00:47,520 --> 00:00:50,090
E depois o resto do texto do parágrafo.

14
00:00:50,160 --> 00:00:57,900
Então, se eu selecionar isso com o documento Duckery selector P, guardo isso em uma variável e eu faço tag com texto de

15
00:00:57,900 --> 00:01:04,500
texto que irá recuperar o texto dentro de cada elemento de cada hora e o texto é definido como qualquer

16
00:01:04,620 --> 00:01:08,210
coisa entre as tags HTML, mas não incluindo o imposto.

17
00:01:08,430 --> 00:01:09,870
Então você verá isso retornar.

18
00:01:09,870 --> 00:01:11,760
Este é um parágrafo incrível.

19
00:01:11,760 --> 00:01:18,110
Ele não contém as tags fortes para que ele apenas extraia todo o texto de dentro desse parágrafo.

20
00:01:18,270 --> 00:01:20,240
No entanto, muitas camadas profundas precisam ir.

21
00:01:20,280 --> 00:01:23,620
Ele agarra todo o texto e retorna uma grande string.

22
00:01:24,120 --> 00:01:30,310
E, claro, também podemos definir conteúdo de texto, como fiz aqui, o conteúdo do texto de tag é igual a blá blá blá.

23
00:01:30,510 --> 00:01:33,830
E isso irá redefinir o conteúdo do texto para ser blá blá blá.

24
00:01:33,870 --> 00:01:35,270
Dentro deste parágrafo.

25
00:01:35,460 --> 00:01:40,140
Ok, então eu vou seguir em frente e demonstrar como podemos usar a propriedade de conteúdo de texto antes de fazer isso.

26
00:01:40,350 --> 00:01:46,500
Eu vou atualizar nossa demonstração de exemplo Tim Page com apenas mais algumas linhas de marcação para que possamos ter

27
00:01:46,500 --> 00:01:47,940
mais algum texto para trabalhar.

28
00:01:47,970 --> 00:01:55,740
Então eu vou adicionar uma UL e, dentro disso, você vai adicionar, vamos fazer flores.

29
00:01:55,860 --> 00:01:57,500
Então orquídeas.

30
00:01:57,900 --> 00:02:04,700
Vamos fazer succulência e durar as tulipas.

31
00:02:04,730 --> 00:02:05,260
ESTÁ BEM.

32
00:02:05,400 --> 00:02:06,560
Nós vamos seguir em frente e trabalhar com isso.

33
00:02:06,560 --> 00:02:09,680
No console do javascript.

34
00:02:09,840 --> 00:02:16,800
Então, aqui está a nossa página aqui é nosso bem com nossos três aliados e, em seguida, também temos este parágrafo que

35
00:02:16,800 --> 00:02:22,380
tem a marca forte em torno da palavra super corgi mixes são super adoráveis ​​como você pode ver.

36
00:02:22,560 --> 00:02:24,340
Sim, eles estão.

37
00:02:24,340 --> 00:02:31,800
Então eu vou para o cônsul e vamos começar apenas selecionando este parágrafo, o documento P é igual.

38
00:02:32,280 --> 00:02:36,740
E meu primeiro instinto é sempre usar o seletor de consulta porque é tão fácil.

39
00:02:36,900 --> 00:02:38,470
Mas não vou fazer isso.

40
00:02:38,580 --> 00:02:41,410
Só que usamos de outra maneira apenas obtenha mais prática.

41
00:02:41,460 --> 00:02:50,550
Eu vou usar elementos GET por nome de tag e esse nome de tag é um parágrafo e então lembre-se de que ainda

42
00:02:50,550 --> 00:02:52,320
temos que pedir o primeiro.

43
00:02:52,690 --> 00:03:01,620
Então, agora, se olharmos para P, temos esse parágrafo e se executarmos conteúdo de texto no conteúdo de texto, nos diz que

44
00:03:01,620 --> 00:03:04,320
as mixagens de corgi são super adoráveis.

45
00:03:04,320 --> 00:03:06,510
Então, é preciso todo o texto lá dentro.

46
00:03:06,870 --> 00:03:13,650
Vamos fazer o mesmo na UL para que selecione o UL UL UL e desta vez

47
00:03:15,470 --> 00:03:17,770
eu usarei o seer selector ul.

48
00:03:18,150 --> 00:03:19,280
Vejamos a UL.

49
00:03:19,320 --> 00:03:21,570
Certifique-se de que temos a correta.

50
00:03:21,570 --> 00:03:22,820
Definitivamente o caminho certo.

51
00:03:22,980 --> 00:03:26,640
E vamos fazer conteúdo sobre isso.

52
00:03:27,330 --> 00:03:35,030
E você pode ver que ele se livra das tags e apenas obtém o conteúdo de texto puro dentro dessa UL e então o

53
00:03:35,040 --> 00:03:37,440
que podemos fazer também é atualizar isso.

54
00:03:37,440 --> 00:03:42,780
Então, isso é um pouco perigoso na verdade, porque digamos que eu quero atualizar o que é esse

55
00:03:42,780 --> 00:03:49,070
conteúdo de texto do parágrafo e eu quero atualizá-lo para dizer que as mixagens de corgi são realmente realmente super adorável.

56
00:03:49,440 --> 00:04:00,630
números de texto de texto igual e depois dizer que as mixagens de corgi são realmente super adoráveis, mas espero que você possa ver o problema.

57
00:04:00,630 --> 00:04:02,600
Bem, eu poderia fazer

58
00:04:02,670 --> 00:04:05,890
Eu vou me livrar desta marca forte aqui.

59
00:04:06,090 --> 00:04:09,180
Se eu pressionar Enter apenas sobrescreva completamente.

60
00:04:09,180 --> 00:04:14,610
Então, se esperamos este elemento agora, acabamos de nos livrar do que estava lá dentro, o que foi

61
00:04:14,600 --> 00:04:15,490
uma forte tomada.

62
00:04:15,600 --> 00:04:20,280
Então, o conteúdo de texto é um pouco perigoso nesse sentido, se você estiver usando isso para definir algo,

63
00:04:20,280 --> 00:04:22,690
não é ruim, mas você precisa ter cuidado com isso.

64
00:04:22,710 --> 00:04:24,880
Você precisa saber exatamente o que está dentro de um elemento.

65
00:04:24,900 --> 00:04:30,420
Se houver H. T. As tags de e-mail que você deseja preservar não querem

66
00:04:30,420 --> 00:04:33,720
apenas configurar automaticamente todo o conteúdo do texto como um fluxo de notícias porque isso irá apagar tudo.

67
00:04:34,050 --> 00:04:39,330
Há outra propriedade que funciona nas mesmas linhas que o conteúdo de texto, exceto que ele realmente mantém

68
00:04:39,480 --> 00:04:43,480
os dois elementos masculinos intactos para que ele não apenas extraia o texto.

69
00:04:43,500 --> 00:04:46,240
Na verdade, ele mantém a estrutura corretamente cada vez.

70
00:04:46,260 --> 00:04:52,800
Elementos retornados, bem como o texto para que a propriedade seja chamada Inner HMO.

71
00:04:53,580 --> 00:04:55,020
Então, temos o nosso mesmo parágrafo.

72
00:04:55,020 --> 00:04:59,970
Este é um parágrafo incrível com tags fortes em torno de tudo incrível.

73
00:05:00,060 --> 00:05:07,140
E depois selecioná-lo com o seletor de consulta e, em seguida, executamos o ponto de etiqueta interno h m

74
00:05:07,140 --> 00:05:11,870
l e isso me dá um parágrafo incrível enquanto mantém a marca forte.

75
00:05:12,270 --> 00:05:18,510
Então, vou mostrar-lhe outro exemplo e atualizar a página para que possamos nossa marca forte de volta aqui e vou seguir

76
00:05:18,510 --> 00:05:20,640
em frente e selecionar o parágrafo novamente.

77
00:05:20,850 --> 00:05:28,040
Documento doc query selector parágrafo e nós vamos executar.

78
00:05:28,350 --> 00:05:33,760
Vamos apenas revisar o conteúdo do texto primeiro e depois vamos fazer isso por ele.

79
00:05:34,870 --> 00:05:38,350
E você pode ver que nós também recuperamos a marca forte.

80
00:05:38,940 --> 00:05:43,300
Vamos fazer o mesmo para o UL e as mentiras que estão dentro dele.

81
00:05:43,320 --> 00:05:49,020
Portanto, var UL é igual ao seletor de consulta documento doc.

82
00:05:49,770 --> 00:05:58,710
Você vai e, então, você vai fazer isso, e nós também obteremos as tags.

83
00:05:58,740 --> 00:06:03,150
Então, isso é útil e veremos algumas situações em que vamos aproveitá-lo em

84
00:06:03,150 --> 00:06:04,770
alguns dos projetos que construímos.

85
00:06:04,770 --> 00:06:08,830
O texto também é útil se estamos apenas mudando o que está dentro de uma etiqueta.

86
00:06:09,120 --> 00:06:15,240
Então, geralmente, na verdade, nós não nos colocamos dentro dele para ser algo, porque é o mesmo problema que

87
00:06:15,250 --> 00:06:20,820
nós teríamos com a configuração do conteúdo de texto que apenas sobrescreve o que está atualmente dentro

88
00:06:20,820 --> 00:06:21,300
de enfurecido.

89
00:06:21,510 --> 00:06:31,820
Então, eu vou mostrar que, se eu disser UL, o HTML interno do ponto agora é igual a plantas são incríveis.

90
00:06:32,870 --> 00:06:36,170
Ele simplesmente o substitui completamente, como fez para o conteúdo do texto.

91
00:06:36,210 --> 00:06:41,530
Então, se quisermos adicionar novos elementos ou queremos interagir com HTML, existem outras formas de fazer isso.

92
00:06:41,760 --> 00:06:45,440
Mas se tudo isso que queremos fazer, por exemplo, é mudar este título.

93
00:06:45,450 --> 00:06:47,750
Bem-vindo à minha demo do Dom.

94
00:06:47,810 --> 00:06:49,340
Você pode selecionar isso primeiro.

95
00:06:49,470 --> 00:06:50,410
É um H-1.

96
00:06:50,730 --> 00:06:53,420
E você percebe que não há nenhum ele fora dentro dele.

97
00:06:53,430 --> 00:06:54,850
É apenas um H-1.

98
00:06:54,990 --> 00:06:59,000
Então, podemos usar conteúdo de texto ou energia M-L não importa.

99
00:06:59,010 --> 00:07:03,190
Mas a maioria das pessoas usaria conteúdo de texto porque isso é tudo que é conteúdo de texto.

100
00:07:03,360 --> 00:07:05,530
E nós poderíamos redefini-lo para ser outra coisa.

101
00:07:05,580 --> 00:07:12,060
Então, isso seria apenas uma questão de documento, vamos fazer o seletor de consulta

102
00:07:12,060 --> 00:07:17,970
novamente e não vou salvá-lo em uma variável apenas para que você

103
00:07:17,970 --> 00:07:29,760
acostume-se a ver este seletor de documentos H-1 e depois podemos encadear no final O conteúdo do texto do ponto é igual e desta lição.

104
00:07:29,760 --> 00:07:33,060
E você pode ver as minhas alterações refletidas aparecerem.

105
00:07:33,060 --> 00:07:39,180
Então, para recapitular conteúdo de texto entre HD M-L, duas formas diferentes de agarrar o conteúdo de um

106
00:07:39,540 --> 00:07:42,750
determinado elemento, nós o selecionamos primeiro, então o corremos enfurecido.

107
00:07:42,810 --> 00:07:49,860
Ou o conteúdo de texto nesse conteúdo de texto do elemento selecionado extrairá apenas o texto e retornará uma grande cadeia cheia

108
00:07:49,860 --> 00:07:55,970
de texto e enfureceu-o Mel irá nos dar tudo como uma seqüência de caracteres, incluindo o afastou ele elementos.

109
00:07:57,240 --> 00:07:59,000
Então, aqui está um pouco de bônus no final.

110
00:07:59,190 --> 00:08:04,120
Isso não é algo que eu espero que você lembre, mas há outra diferença entre HTML enfurecido

111
00:08:04,120 --> 00:08:07,100
e conteúdo de texto e eu vou ilustrar isso aqui.

112
00:08:07,350 --> 00:08:14,700
Vamos tentar algo como esse corpo de despejo de documentos que nos dá o corpo inteiro datt HMO interno.

113
00:08:15,420 --> 00:08:21,230
E você pode ver se obtemos todo o HTML para o corpo, tudo o que podemos fazer da

114
00:08:21,240 --> 00:08:30,090
mesma forma com o texto inserido ou com conteúdo de texto como esse e nós obtemos todo o texto em nossa página, que é apenas essas três linhas.

115
00:08:31,230 --> 00:08:36,480
O que posso fazer é que, se eu quisesse mudar, desejava me livrar de tudo nesta

116
00:08:36,480 --> 00:08:42,840
página, o que não é realmente uma boa idéia, mas se eu quisesse e queria substituí-lo por um novo

117
00:08:42,840 --> 00:08:50,550
H-1 e que H-1 acabei de dizer adeus para fazer isso, eu poderia fazer algo como este documento, o conteúdo do texto do

118
00:08:50,550 --> 00:08:57,700
corpo da música é igual e eu poderia colocar uma marca H-1 aqui e fazer algo assim quando eu estiver escrevendo HMO.

119
00:08:57,930 --> 00:08:59,380
E se eu entrar em cena.

120
00:08:59,940 --> 00:09:02,190
Ah, não, na verdade, não funciona.

121
00:09:02,190 --> 00:09:07,070
Então, o conteúdo do texto não vai tratar a string como HMO.

122
00:09:07,080 --> 00:09:14,540
Ele trata-o puramente como texto para não renderizar a marca H-1 versus se eu fiz o mesmo

123
00:09:14,550 --> 00:09:15,460
com enfurecido.

124
00:09:17,520 --> 00:09:19,400
Em seu HMO.

125
00:09:20,340 --> 00:09:22,740
Você pode vê-lo realmente como um H-1.

126
00:09:22,830 --> 00:09:28,440
Então, isso é uma nuance, mas a diferença importante é que o conteúdo de texto trata o que quer que você lhe dê,

127
00:09:28,440 --> 00:09:31,560
e o que quer que você dê, apenas como texto e dentro dele.

128
00:09:31,600 --> 00:09:36,210
Na verdade eu tratá-lo como H M L e renderizado na página se você dar tags para renderizar