Truques de JavaScript DOM que você precisa conhecer

Рет қаралды 28,461

Жыл бұрын

Saia do básico da programação com o Explorer Lab, evento online e gratuito: rseat.in/explorer-lab
Document Object Model (DOM) é a modelagem que guia um objeto JavaScript.
Pra facilitar a nossa vida de dev, Maykão reuniu cinco truques de JS DOM que você com certeza vai querer conhecer.
Link para VISUALIZAR o código da aula:
fronteditor.dev/gists/d75d7978...
Link para EDITAR o código da aula:
fronteditor.dev/gists/d75d7978...
-----
Conecte-se a 200mil devs e avance para o próximo nível com a nossa plataforma: rocketseat.com.br/
Cadastre-se na nossa plataforma: app.rocketseat.com.br/signup
Junte-se a mais de 392mil devs em nossa comunidade no Discord: / discord
Acompanhe a Rocketseat nas redes sociais:
Twitter: @rocketseat
Facebook: @rocketseat
Instagram: @rocketseat_oficial

Пікірлер: 68

@brunohuguenin9284 Жыл бұрын

Que didática incrível! Muito obrigado pelo conteúdo, irmão.

@maikemanoel597 Жыл бұрын

Que vídeo sensacional!! Como pode tanto conteúdo em tão poucos minutos?

@LeandroSilva-mw5yl Жыл бұрын

Maykao, você é um show de simpatia ja ganha a pessoa logo no início do vídeo até quem não programa provavelmente assiste muito obrigado pelos vídeos mano ..abraço

@alexsoares9468 2 ай бұрын

Ajudou muito, obrigado cara!

@cleuvissoaresdasilva4725 Жыл бұрын

O cara e bom na didatica viu.Parabéns!!

@breakbosscrewoficial4249 Жыл бұрын

Obrigado pelo conteúdo Vcs são de mais 🤝

@lembranaodesistaissonaoimp5762 Жыл бұрын

Maykãoooo te amoooo ❤️

@MariusHKz Жыл бұрын

Só por falar query corretamente já ganhou meu like. Além disso, parabéns pelo ótimo conteúdo.

@HumbertoSS1981 Жыл бұрын

muito muito muito bom... a didática é top de mais

@duronne3951 Жыл бұрын

Ah que material estupidamente perfeito. Tenho muita dificuldade na manipulação da DOM enquanto faço o curso Explorer e nesse video descobri que posso pegar atralhos com o currentTarget, contains e cloneNode. 🤩

@xaveko Жыл бұрын

Mestre em ensinar!!!

@renan-ferreira Жыл бұрын

Muito bommmmmmmmmm, valeu manow!

@edimilsonbrazZ Жыл бұрын

Show demais esse conteúdo... Eu confeço que não conhecia cloneNode(). Economiza bastante linhas de código com ele... um verdadeiro clean Code hehe... show Maikão

@lucaskennari8246 9 ай бұрын

Conteúdo brabo!

@tvcetacapoeira7533 Жыл бұрын

It's working thanks my friend

@geoatuais 10 ай бұрын

é difícil acha um vídeo sobre dom em português no you tube melhor que esse até agora.

@mygrocerystore960 10 ай бұрын

Valeu!

@joaocuriosidades2331 Жыл бұрын

a parte do remove, foi a melhor

@victorbusolin9469 Жыл бұрын

Parabéns pela didática Maykão. Depois de alguns meses trabalhando com frameworks chega até ser meio estranho ver js vanilla. Parabéns pelo vídeo!!

@maykbrito Жыл бұрын

Néah? hehehe Obrigado mano!

@moisesximenes9363 Жыл бұрын

Top demais!!! Dessas formas de adicionar qual tem um melhor processamento (pensando em uma grande lista)?

@henriquefreitas1224 Жыл бұрын

espero um dia chegar a 50% do seu conhecimento maikao, vc é fera!!

@rodrigomoura2108 Жыл бұрын

Quando esse dia chagar ainda vai falaram uns 95% pra fazer qualquer coisa no mundo real.

@rodrigomoura2108 Жыл бұрын

Na verdade quase nada disso se usa no mundo real. Tire isso do para efeito de conhecimento, só pra saber que isso existe.

@minhatrilhajpb 7 күн бұрын

🎉🎉🎉🎉🇦🇴🇦🇴🇦🇴 Só bala🔥🔥🔥

@WoWGuirelle Жыл бұрын

Esta parte do cloneNode eu não sabia, teria me poupado algumas horas em alguns projetos no passado... heheheheh

@spiielberg Жыл бұрын

🚀

@rafamuguet Жыл бұрын

Fala Dev beleeeza?

@Matheus_1582 Жыл бұрын

Mayke, você usa algum Framework pra construir suas paginas Web ou você usa só o HTML CSS JS mesmo.

@maiconpereiradesouza5533 8 ай бұрын

cloneNode esse eu não conhecia

@am-castro Жыл бұрын

Mayk, não encontro onde faz aquele card de aviso que tem na rocketseat, com aquele timer bonitinho à esquerda. Tendo 2 avisos, o primeiro desce e o mais recente fica em primeiro. Aquilo é JS?

@viniciusvirtuoso7459 Жыл бұрын

Fala dev blz? Eu tenho uma duvida, trabalho com react, e a pouco tempo fiz um projeto que precisava de funcionalidade de drag and drop, usei uma lib para resolver isto. Ai fiquei pensado "cara eu não tenho ideia de como faria essa funcionalidade na mão". Eu queria saber se isso é normal?

@luizcdocarmo Жыл бұрын

Me lembro que a pesquisa do Google tinha esse problema de "remoção eterna"

@alexjunior3469 Ай бұрын

Oi Mayk sou iniciante e não sei oq fazer para entender front end e estou com dificuldade em entender DOM tenho que fazer Freelas e não sei por onde começar!?

@leleparanormal1579 Жыл бұрын

Maikão, pq vc ta usando o Microsoft Edge, ta sendo melhor que o Chrome?

@maykbrito Жыл бұрын

Tenho gostado muito mais.. Acho mais leve e tem algumas coisas, como agrupador de tabs, que acho simples e essencial.

@arthurpeixotomelo373 Жыл бұрын

@@maykbrito Além de ser mais leve, tem tabs na lateral, muito útil se você tirar a barra superior também, pois amplia o espaço útil (os comandos de minimizar, fechar janela se espremem no lado direito......isso no windows fica muito parecido como funciona no MAC)

@alefreis6778 Жыл бұрын

Mayk, depois você poderia postar uma solução ao desafio proposto, to fritando a mente aqui mas não consegui criar um item sem estar com o clodeNode...

@cesardamasceno6645 Жыл бұрын

Você poderia deixar um li já feito em memória: dentro de uma const e quando fosse dá o cloneNode seria dele.

@youngdll7 Жыл бұрын

@@cesardamasceno6645 poderia explicar melhor ? rsrs

@player35_ Жыл бұрын

Cheguei muito perto da solução, aí ele tava criando varios span e button dentro da li, resolvi mas agora surgiu um problema que o span pode ir vazio. Desisto

@asdasd54564 Ай бұрын

Tem uma coisa nos vídeos de aula de programação que me irrita muito. Nitidamente não selecionam o publico alvo, tentam trazer um pouco de tudo. Se você vai explicar truques do DOM, não precisa explicar o que é DOM, quem veio pro vídeo já sabe o que é!!!

@marcossacramento5957 Ай бұрын

Amigão, é só vc pesquisar um pouquinho mais kkkk programador tem que ter essa autonomia

@asdasd54564 Ай бұрын

@@marcossacramento5957 Pesquisar mais o que? Você entendeu meu comentário mesmo?

@arturvalentim7120 10 ай бұрын

chegou a hora do elementos e comecei entender nada

@rodrigomoura2108 Жыл бұрын

A DOM?! Document object model tanto em inglês quanto em português são masculinos então porque a DOM?! Desculpa mas não dá pra dar moral pra vocês se não sabem nem como as coisas se chamam.

@mashirolvsky Жыл бұрын

A DOM deve se chamar assim por conta de ser ligada analogamente a uma arvore. se eu estiver errado me corrija, mas já vi em algumas explicações usarem uma forma para explicar a DOM como uma Arvore... deve ser por isso que o termo que se usa é a DOM.

@rodrigomoura2108 Жыл бұрын

@@mashirolvsky A arvore. O DOM. Pergunta pra sua prof.

@rodrigomoura2108 Жыл бұрын

@@mashirolvsky Ex a arvore tem um tronco e nem por isso se chama a tronco.

@rodrigomoura2108 Жыл бұрын

@@mashirolvsky uma dica muito boa. Aprenda inglês, só assim pra ir para o próximo nível. Não existe programador bom mesmo que não saiba inglês. Tudo de mais novo sai primeiro em inglês. Essa semana por exemplo teve um evento em Londres chamando advanced react que quem não sabe inglês perdeu. Nem sei se vão traduzir. Acredito que não pq só o primeiro dia foram mais de seis horas.

@mashirolvsky Жыл бұрын

ok então...