Bem vindo de volta.
Neste vídeo vamos pegar onde paramos e continuar falando sobre alguns desses
métodos importantes que eu quero mostrar o próximo que vamos discutir é depois das oito.
E é curto para o atributo, então eu vou para os documentos e só procurar atributos.
Vai estar no topo aqui ETR.
Aqui vamos nós.
E o que usamos é para recuperar o valor de um atributo.
primeiro elemento em um conjunto de elementos correspondentes ou defina um ou mais atributos para cada elemento correspondente.
Então, de acordo com os documentos, ele obtém o valor de um atributo para o
Então podemos recuperar um atributo ou podemos definir um atributo.
Espero que você esteja percebendo um padrão até agora, onde com esses métodos, podemos obter informações
para recuperar um atributo ou recuperar o estilo ou recuperar o texto ou o enfurecer.
E então também podemos configurá-los passando um argumento para o método.
Portanto, um método se comporta de duas maneiras diferentes.
E este paradigma é chamado de paradigma getter e setter onde temos um getter para recuperar
informações e um setter para definir um novo valor.
Vejamos alguns exemplos aqui.
Os documentos do código G sempre têm excelentes exemplos e documentação e escrita de estilo tutorial.
Então vamos dar uma olhada aqui.
Temos uma imagem e tem um I. D. uma fonte e um texto alternativo para que possamos
selecionar isso para que possamos selecionar a imagem com uma ótima foto ID grande foto ponto H.
E passamos o que estamos tentando mudar, o que é Alt.
E então podemos passá-lo em um novo valor e você também pode ver aqui, podemos usar o TTR para definir vários valores
ao mesmo tempo ou vários atributos.
Então podemos definir o texto e o atributo do título passando em um objeto, assim como o método CSSA.
ESTÁ BEM.
Então vamos brincar com isso.
Aqui está a nossa página com a qual estamos trabalhando.
Eu vou adicionar um pouco mais de cada equipe que vou contente.
Então, no fundo, vou adicionar uma marca de imagem e a fonte será o meu pinheiro preferido.
Tão adorável.
vamos fazer é usar a consulta J e o método TTR para mudar essa fonte de imagem para o terrível pinheiro martin.
E o que
ESTÁ BEM.
Então, irá atualizar nossa página.
Aqui está a nossa imagem e o que seria um bom primeiro exercício é selecionar a imagem e torná-la um pouco
mais gerenciável de forma tão pequena.
Então, nós selecionaremos a imagem nos veremos e podemos começar apenas olhando o que a largura atualmente
é, que é 1133 pixels e vamos torná-lo muito menor.
Então, mudaremos com 2 500 pixels assim.
OK, isso parece muito melhor.
E na verdade isso é um pouco menor e meses até 200.
Aqui vamos nós.
Há nosso adorável pinheiro Martin.
Então, usaremos TTR para avançar e mudar a fonte da imagem.
Então, precisamos selecionar a imagem novamente como esse ponto 8.
E podemos obter o valor da fonte primeiro, basta recuperá-lo.
no nosso segundo argumento, que é o URL que eu copi e tenho na minha área de transferência e lá vamos.
Esta é a fonte da imagem e, em seguida, também podemos configurá-lo passando
Ele atualiza automaticamente.
E o nosso aterrador pintinho de Martin.
Então, esse é um exemplo.
Outra coisa que podemos fazer aqui é selecionar esta entrada que é tipo igual a texto e podemos
alterar o valor do atributo de tipo.
Então, vamos fazer isso aqui e então vamos ver o atributo.
Bem, vamos começar apenas olhando a entrada.
É o único na página.
E então vamos fazer esse tipo de atributo e vemos que o tipo é texto e agora podemos brincar com ele e mudar isso para
que o tipo seja colorido.
E assista esta entrada aqui quando acertei no enter.
Agora ele muda para uma entrada de cores e podemos fazer a mesma coisa.
Mude-o desta vez para ser uma caixa de seleção.
Aqui vamos nós.
ESTÁ BEM.
Vamos voltar ao texto porque vamos usar isso mais tarde no vídeo como entrada de texto.
A última coisa que eu quero demonstrar é o comportamento do método TR em vários elementos, então
vamos adicionar algumas tags de imagem.
Então, vamos fazer uma duas três imagens e eu vou precisar atualizar para obter essas.
E lá essas imagens gigantescas.
Então eu vou redimensionar novamente e isso será Imagem ponto ver SS com Khama 200 atos e por causa da magia do J
Query que vai fazer todos eles 200 pixels.
que eu só quero mudar o primeiro aqui para ser a foto de marmelo de pinho assustadora com os dentes.
OK, suponhamos
O que fiz anteriormente não funcionará se eu tentar e simplesmente selecionar a imagem que é realmente todas as imagens e, portanto,
irá mudar as três fontes da sua imagem.
Então, se eu quiser apenas o primeiro, posso usar o colon da imagem e lembre-se de que é primeiro o tipo como
o primeiro construído em J queery, que é mais curto, mas geralmente ligeiramente mais lento porque não está
usando um seletor CSSA incorporado.
Então vou voltar ao primeiro tipo e então podemos mudar a fonte para ser nossa imagem assustadora que você conhece.
E se eu entrar, ele só afeta essa primeira imagem.
E se eu quisesse atualizar a última imagem para ter a mesma fonte de imagem, este terrível
pinho martin eu tenho algumas opções e a primeira que eu vou mostrar é selecionar todas as imagens assim e usar o
último método que é algo você ainda não viu e isso retornará o último elemento de
um determinado seletor.
Então, isso seleciona as três imagens e depois estamos pedindo a última e depois podemos fazer essa fonte ATSDR
e então podemos colar na fonte da nossa imagem e clicar em Enter.
E você pode ver que a última imagem também foi alterada.
E, finalmente, vou demonstrar mudar todos os três juntos, então eu tenho uma nova imagem que você é.
Eu vou copiar aqui e mudarei o atributo de origem em todos eles, apenas selecionando todas as imagens
como esta e, em seguida, executando essa vírgula fonte de atributo e colando no nosso Novo Você é tudo e
todas as três imagens mudam simultaneamente.
Então, para resumir a TTR, se acabamos de dar um argumento como fonte.
Mas não passamos um segundo argumento.
Apenas retornará o valor da fonte.
Então esse é o getter.
fizemos aqui que realmente atualizará o valor da fonte em cada elemento que selecionamos anteriormente.
E então, se nós fornecemos um segundo argumento como um novo que você gosta, nós
Então, a próxima coisa que eu quero demonstrar é o método Vau.
Então, o VHDL que o Val faz é que nos ajuda a extrair o valor de uma entrada.
Então, se você pode pensar de volta quando você fez esse marcador com javascript simples e nós tivemos essa
entrada de número e essa entrada, você poderia especificar a pontuação vencedora para jogar para 5 ou para 10 e precisávamos
extrair o valor para fora disso.
Utilizamos uma propriedade denominada valor.
Bem Vau é J envolve o wrapper para o valor, como cada tim.
É um invólucro de Jamail enfurecido e o texto é o invólucro para conteúdo de texto.
Você pode ver alguns exemplos como você pode ver aqui.
Se não passarmos nenhum argumento, ele retornará o valor de um elemento específico que selecionamos.
Então, neste caso, estamos agarrando o menu suspenso no elemento selecionado com a classe de foo e então estamos
fazendo o Val no qual nos indicará qual elemento ou qual parte do menu suspenso está selecionada e, então, também
podemos usar a mesma sintaxe mas passamos em um argumento e isso mudará o valor de uma entrada.
Então, vamos para a nossa entrada de texto aqui e eu vou limpar o console e vamos seguir em frente
e selecionar esta entrada de texto.
Então, um sinal de dólar insere exatamente assim e então vamos executar o Val sem argumentos.
E agora, nos daria uma string vazia porque o valor aqui é uma string vazia.
Não há nada lá dentro.
Então, se escrevemos algo agora como meu nome e depois pedimos o valor que nos diz aço frio.
Então, o que quer que seja aqui é agarrado quando corremos embora e, como todos os outros métodos que vimos,
ele também atuará como um método setter.
Então, se eu passar em algo como aço enferrujado e acertei, eu vejo que ele atualiza a entrada para
agora dizer resti ainda.
Você pode estar se perguntando quando realmente escrevemos código para atualizar uma entrada.
Normalmente, deixamos um usuário atualizar a entrada.
O único caso de uso comum que eu posso pensar é se queríamos limpar o valor.
Então, se esta fosse uma lista de tarefas e nós queríamos que o usuário pudesse adicionar novos
Candie ou algo que eu pudesse digitar em geléias, que são sobrevalorados, e entramos e entramos e queremos adicionar um novo aliado
e depois queremos apagar o que está aqui dentro.
Usaríamos ponto.
Então eu vou te mostrar.
Apenas parece assim.
E então vamos configurá-lo para uma seqüência vazia e isso apaga o conteúdo dentro de lá, então faremos isso
na verdade quando criarmos a nossa própria lista.
Usaremos o Vau com uma string vazia para redefinir o texto e colocá-lo.
A última coisa que vou mencionar é que Darvell trabalha em todos os elementos que têm um atributo de valor.
Portanto, não é apenas entradas com texto de chamadas de tipo, como caixas de seleção e cores
para entradas de cores, mas também inclui menus suspensos que eu posso seguir em frente e
escrever irá criar um novo menu suspenso que é um elemento selecionado e, em seguida, dentro desta seleção, adicionamos As opções e cada opção representam uma escolha.
Então, nossas opções conterão alguns dos animais de estimação mais populares no país, como avestruz e tartaruga e
Sapo.
OK e vamos economizar e atualizar a página e você pode ver que agora temos um menu suspenso com três opções e se
eu quiser saber qual a escolha que o usuário selecionou, eu poderia ir até aqui e eu não apenas selecionar a
entrada de qualquer Mais.
Eu precisaria selecionar qualquer um que me dê esse menu suspenso e então eu apenas executar o Vau sobre
isso e isso me diz que o usuário selecionou sapato. Tudo bem.
em seguida, fÃ¼lle é usado para recuperar o valor ou definir o valor de qualquer tipo de menu de entrada ou de lista suspensa.
Então, para encerrar 80 TR é usado para acessar qualquer atributo específico que queremos ou para definir um atributo e,
Tudo bem