[JS4 - tópico 2] Criando elementos HTML dinamicamente com JavaScript

Показать описание

- Criando com innerHTML (00:00)
- Criando com createElement() (01:49)
- Adicionado elemento ao DOM (04:20)
- Usando .appendChild() (05:51)
- Usando .insertBefore() (06:41)
- Usando .replaceChild() (08:34)
- Definindo texto (09:18)
- Removendo elementos (11:04)

Atividade prática
- Download do código seminal:

---

Рекомендации по теме

Комментарии

cara ajudou muiiiito, faço curso de Ti e já aprendi um pouco do html e css e resolvi q nas ferias queria aprender Js, já fiz boa parte da minha página agora só falta as ações.

VitorHugo-wrvi

Explicou muito bem meu caro! Parabéns!!

diegolopesdomingos

que didática meus amigos, QUE DIDÁTICA!

brina

Baita aula, Flávio! Tava lendo vários materiais e não tava rolando entender essa parte. Valeuuu. Tua voz é ótima também

marinaluasantos

Estou a 3 anos atrasado, mas fica aqui meu elogio... didática excelente, impossível não entender. Muito bom mesmo, parabéns. +1 inscrito!

rafaelcesarvalencio

Excelente, me ajudou a organizar algumas ideias !!!
Um adendo, outros motivos para não utilizar o innerHTML são: o fato dele reescrever o HTML e dessa maneira o DOM tem que ser recriado e o fato de ficar vulnerável a ataques XSS, lógico dependendo da implementação.

FernandoLeonid

uhuuul, conteúdo super bem explicado.
parabéns!

danieljosias

Uma aula excelente. Bem detalhada. Parabéns. Valeu pela dica.

sssouto

Cheguei no seu canal por acaso. Que conteúdo top. Esse parte de HTML ainda acho muito confusa. Eu estou estudando JS para usar no Backend, mas tenho que ter esse conhecimento em HTML. Muito bom. Agora vou maratonar seus vídeos.

popaheffner

Cara que fantastico! Me ajudou Bastante! Obrigado

diegorigo

Cara, que aula fantástica!!! Uma das melhores aulas que eu já assisti no Youtube e olha que já assisti centenas!!! Meus parabéns!!! Continue produzindo conteúdo porque a qualidade da sua aula é inquestionável!!!

devrical

Ótima Aula! E se eu quiser que apareça elementos diferentes, um por vez, de forma aleatória, como posso fazer? Estou quebrando a cabeça aqui, tentando fazer isso num jogo de "estourar balões"... Consegui fazer aparecer três tipos de balões diferentes, porém aparecem os 3 ao mesmo tempo, quero que apareça 1 por vez aleatoriamente...

edleusa_diariodeumacrespa

so uma duvida; Quando eu adiciono o elemento dessa maneira, assim que eu atualizo a pagina o elemento some, ele não esta salvando no html quando clico pra adicionar. o que pode estar acontecendo?

diegorigo

valeu demais man, me ajudo num exercicio dificil de resolver

kowezasso

Putz, tava 3 horas tentando fazer esse video com os primeiros 5 min ja deu pra entender👏👏👏

lucasduarte

Acabei de conhecer o canal através dessa aula, tenho um projeto e precisava aprender a adicionar os elementos dinamicamente, muito obrigado +1 inscrito.

davisonalves

Por que é considera uma má prática utilizar o HTML dentro do JS utilizando JS puro, mas se usamos uma biblioteca ou framework como React isso acaba sendo normal e a grande vantagem dessas bibliotecas?

FelipeFloripaa

Boa tarde mano blz?
Se ligue, estou criando um quiz com 10 questões, como faço pra colocar uma imagem pra cada questão no Javascript?

rafaelmagalhaes

[JS4 - tópico 2] Criando elementos HTML dinamicamente com JavaScript

[JS4 - tópico 2] Criando elementos HTML dinamicamente com JavaScript

[JS4 - tópico 1] Usando objetos em JavaScript

[JS4 - tópico 3] Atividade da Lista de Tarefas

[Aula 3 - tópico 2] Tags para criar listas de itens em HTML

[JS3 - tópico 2] Estilizando elementos HTML com JavaScript

Como pegar elementos com Javascript - For loop tags

[Aula 14 - tópico 2] Estilizando elementos dinamicamente

[JS2 - tópico 3] Alterando o DOM com JavaScript

Como Listar Dados do Array em Tabela HTML - Curso de Javascript Puro Orientado a Objetos - Aula 4

Javascript - como remover o atributo de um elemento - removeAttribute - codigo sem frescura

[JS5 - tópico 2] Representação usando JSON

CRIANDO UM ELEMENTO PERSONALIZADO NO HTML COM JAVASCRIPT DOM | PROGRAMAÇÃO PARA INICIANTES

Como criar OBJETOS e CLASSES em JavaScript

Curso de Javascript - #12 DOM | appendChild e removeChild

Criando DIV redimensionável com JAVASCRIPT PURO

4 Bar chart vertical streaming in Chart JS | Chartjs Plugin Streaming Series

Curso de JS Aula 46 JS OO Métodos e método específico

Use JavaScript to show a picture

Como fazer uma JANELA MODAL em JavaScript sem frameworks (1/2)

Sass como criar classes dinamicamente?

How to Create Two Arbitrary Lines in Chart JS

Curso de Javascript #78 - getAttribute, obtendo atributos HTML pelo javascript

Campo HTML para inserir tags com CSS e JavaScript | Code/Drops #51

[HTML5 - tópico 1] Divitite e as tags semânticas no HTML