Bem vindo de volta.
Neste vídeo vamos pegar onde paramos.
Nós continuaremos falando sobre outras formas de manipular elementos.
Lembre-se de selecioná-los e, em seguida, manipular e, até agora, vimos como podemos alterar a cor ou qualquer
estilo de propriedades e também como podemos usar a lista de classes para afetar o estilo também.
Então, neste vídeo, vamos falar sobre duas propriedades diferentes que nos permitem mudar
o texto ou o idoso em uma página.
ou em vez de uma marca forte, como eu tenho aqui ou para que eu deseje alterar a tag âncora no próprio texto.
Então, se eu quisesse mudar o conteúdo em vez de uma etiqueta H1
Isso é o que vamos ver como fazer neste vídeo.
Então, a primeira propriedade é algo chamado conteúdo de texto.
Como você pode ver aqui, tenho um parágrafo com algum texto e uma etiqueta forte que diz Awesome.
E depois o resto do texto do parágrafo.
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
texto que irá recuperar o texto dentro de cada elemento de cada hora e o texto é definido como qualquer
coisa entre as tags HTML, mas não incluindo o imposto.
Então você verá isso retornar.
Este é um parágrafo incrível.
Ele não contém as tags fortes para que ele apenas extraia todo o texto de dentro desse parágrafo.
No entanto, muitas camadas profundas precisam ir.
Ele agarra todo o texto e retorna uma grande string.
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á.
E isso irá redefinir o conteúdo do texto para ser blá blá blá.
Dentro deste parágrafo.
Ok, então eu vou seguir em frente e demonstrar como podemos usar a propriedade de conteúdo de texto antes de fazer isso.
Eu vou atualizar nossa demonstração de exemplo Tim Page com apenas mais algumas linhas de marcação para que possamos ter
mais algum texto para trabalhar.
Então eu vou adicionar uma UL e, dentro disso, você vai adicionar, vamos fazer flores.
Então orquídeas.
Vamos fazer succulência e durar as tulipas.
ESTÁ BEM.
Nós vamos seguir em frente e trabalhar com isso.
No console do javascript.
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
tem a marca forte em torno da palavra super corgi mixes são super adoráveis ​​como você pode ver.
Sim, eles estão.
Então eu vou para o cônsul e vamos começar apenas selecionando este parágrafo, o documento P é igual.
E meu primeiro instinto é sempre usar o seletor de consulta porque é tão fácil.
Mas não vou fazer isso.
Só que usamos de outra maneira apenas obtenha mais prática.
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
temos que pedir o primeiro.
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
as mixagens de corgi são super adoráveis.
Então, é preciso todo o texto lá dentro.
Vamos fazer o mesmo na UL para que selecione o UL UL UL e desta vez
eu usarei o seer selector ul.
Vejamos a UL.
Certifique-se de que temos a correta.
Definitivamente o caminho certo.
E vamos fazer conteúdo sobre isso.
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
que podemos fazer também é atualizar isso.
Então, isso é um pouco perigoso na verdade, porque digamos que eu quero atualizar o que é esse
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.
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.
Bem, eu poderia fazer
Eu vou me livrar desta marca forte aqui.
Se eu pressionar Enter apenas sobrescreva completamente.
Então, se esperamos este elemento agora, acabamos de nos livrar do que estava lá dentro, o que foi
uma forte tomada.
Então, o conteúdo de texto é um pouco perigoso nesse sentido, se você estiver usando isso para definir algo,
não é ruim, mas você precisa ter cuidado com isso.
Você precisa saber exatamente o que está dentro de um elemento.
Se houver H. T. As tags de e-mail que você deseja preservar não querem
apenas configurar automaticamente todo o conteúdo do texto como um fluxo de notícias porque isso irá apagar tudo.
Há outra propriedade que funciona nas mesmas linhas que o conteúdo de texto, exceto que ele realmente mantém
os dois elementos masculinos intactos para que ele não apenas extraia o texto.
Na verdade, ele mantém a estrutura corretamente cada vez.
Elementos retornados, bem como o texto para que a propriedade seja chamada Inner HMO.
Então, temos o nosso mesmo parágrafo.
Este é um parágrafo incrível com tags fortes em torno de tudo incrível.
E depois selecioná-lo com o seletor de consulta e, em seguida, executamos o ponto de etiqueta interno h m
l e isso me dá um parágrafo incrível enquanto mantém a marca forte.
Então, vou mostrar-lhe outro exemplo e atualizar a página para que possamos nossa marca forte de volta aqui e vou seguir
em frente e selecionar o parágrafo novamente.
Documento doc query selector parágrafo e nós vamos executar.
Vamos apenas revisar o conteúdo do texto primeiro e depois vamos fazer isso por ele.
E você pode ver que nós também recuperamos a marca forte.
Vamos fazer o mesmo para o UL e as mentiras que estão dentro dele.
Portanto, var UL é igual ao seletor de consulta documento doc.
Você vai e, então, você vai fazer isso, e nós também obteremos as tags.
Então, isso é útil e veremos algumas situações em que vamos aproveitá-lo em
alguns dos projetos que construímos.
O texto também é útil se estamos apenas mudando o que está dentro de uma etiqueta.
Então, geralmente, na verdade, nós não nos colocamos dentro dele para ser algo, porque é o mesmo problema que
nós teríamos com a configuração do conteúdo de texto que apenas sobrescreve o que está atualmente dentro
de enfurecido.
Então, eu vou mostrar que, se eu disser UL, o HTML interno do ponto agora é igual a plantas são incríveis.
Ele simplesmente o substitui completamente, como fez para o conteúdo do texto.
Então, se quisermos adicionar novos elementos ou queremos interagir com HTML, existem outras formas de fazer isso.
Mas se tudo isso que queremos fazer, por exemplo, é mudar este título.
Bem-vindo à minha demo do Dom.
Você pode selecionar isso primeiro.
É um H-1.
E você percebe que não há nenhum ele fora dentro dele.
É apenas um H-1.
Então, podemos usar conteúdo de texto ou energia M-L não importa.
Mas a maioria das pessoas usaria conteúdo de texto porque isso é tudo que é conteúdo de texto.
E nós poderíamos redefini-lo para ser outra coisa.
Então, isso seria apenas uma questão de documento, vamos fazer o seletor de consulta
novamente e não vou salvá-lo em uma variável apenas para que você
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.
E você pode ver as minhas alterações refletidas aparecerem.
Então, para recapitular conteúdo de texto entre HD M-L, duas formas diferentes de agarrar o conteúdo de um
determinado elemento, nós o selecionamos primeiro, então o corremos enfurecido.
Ou o conteúdo de texto nesse conteúdo de texto do elemento selecionado extrairá apenas o texto e retornará uma grande cadeia cheia
de texto e enfureceu-o Mel irá nos dar tudo como uma seqüência de caracteres, incluindo o afastou ele elementos.
Então, aqui está um pouco de bônus no final.
Isso não é algo que eu espero que você lembre, mas há outra diferença entre HTML enfurecido
e conteúdo de texto e eu vou ilustrar isso aqui.
Vamos tentar algo como esse corpo de despejo de documentos que nos dá o corpo inteiro datt HMO interno.
E você pode ver se obtemos todo o HTML para o corpo, tudo o que podemos fazer da
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.
O que posso fazer é que, se eu quisesse mudar, desejava me livrar de tudo nesta
página, o que não é realmente uma boa idéia, mas se eu quisesse e queria substituí-lo por um novo
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
corpo da música é igual e eu poderia colocar uma marca H-1 aqui e fazer algo assim quando eu estiver escrevendo HMO.
E se eu entrar em cena.
Ah, não, na verdade, não funciona.
Então, o conteúdo do texto não vai tratar a string como HMO.
Ele trata-o puramente como texto para não renderizar a marca H-1 versus se eu fiz o mesmo
com enfurecido.
Em seu HMO.
Você pode vê-lo realmente como um H-1.
Então, isso é uma nuance, mas a diferença importante é que o conteúdo de texto trata o que quer que você lhe dê,
e o que quer que você dê, apenas como texto e dentro dele.
Na verdade eu tratá-lo como H M L e renderizado na página se você dar tags para renderizar