Seu carrinho

Nosso Whatsapp: (41) 99721-1993

Planos a partir de R$ 15,00

wp header logo 126.png

Como exibir um Objeto Javascript dentro de uma div? – Clube do Hardware

Esqueceu sua senha?
Ou entre com um desses serviços
Por imDEV
em Web e banco de dados

Olá a todos, sou iniciante em programação e me deparei com a seguinte situação.
Sei criar um objeto, porêm não sei como exibilo dentro de uma div no meu html.
 
Suponhamos que eu quisesse exibir o seguinte objeto dentro da minha <div class=”objeto”>
 
De que forma eu faria isso?
com inner.HTML ? inner.Text ? nenhum dos dois ?
@imDEV Podes fazer com InnerHTML. 
 
 
 Exemplo online: https://jsfiddle.net/dife/4kcrg1sL/
 
NO  exemplo acima, o elemento DIV precisa ser com  “ID”,  caso queira usar  “class”..  fica dessa maneira:
 
 
 
Olá!
Exibir com que intuito?
Se for apenas para debugar, segue sugestão:
 
 
image.png.cf310128af812477ef51c4f3aa5231f9.png
@imDEV No caso de debbug você pode usar o proprio console do Web development tools.
image.thumb.png.b28c0a85957d2e290136220c1ffab41f.png
 
Nesse caso eu usei o console.table.
@DiF
 
@DiF entendi qual era o problema, eu estava tentando usar o class e não o ID.
bom, entendi a forma de usar o ID, agora essa forma de usar a class só não entendi essa array antes do innerHTML.
Teria como me explicar basicamente o porque usar essa array antes ?
@imDEV
agora essa forma de usar a class só não entendi essa array antes do innerHTML.
Teria como me explicar basicamente o porque usar essa array antes ?
O método getElementsByClassName  retorna um vetor de objetos, o HTMLcollection que contém todos elementos filhos que possuem o nome da classe informado.
Ele vai pegar as várias ocorrências de uma classe.. é uma lista também. Então no caso,  no exemplo  continha apenas 1 elemento com essa classe, logo, seria necessário buscar o primeiro elemento dessa lista.. que é o índice zero.   [0]  
 
 
Agora vamos a outro exemplo:
 
 
 
Vamos supor que você precisa alterar o texto e a cor do segundo paráfrafo de um dos filhos de um elemento
 
Veja, que agora, o elemento possui 3 ocorrências da mesma classe, para buscar o segundo elemento, informamos ao getEelementsByClassName que seja pego o elemento no índice [1]
 
Veja na prática: https://jsfiddle.net/dife/t40z2m8x/1/
Você precisa ser um usuário para fazer um comentário
Crie uma nova conta em nossa comunidade. É fácil!
Já tem uma conta? Faça o login.
Notebooks
Por xlemes

Placas-mãe
Por SamuelCarlo202

Placas-mãe
Por Roman737

Processadores
Por Caio rodriguez

Refrigeração e superaquecimento
Por Usiib3

Memórias (RAM)
Por Rafael1352

Placas de vídeo
Por gustavorb3

Montagem e upgrade de computadores de mesa
Por pedrosxz

Recomendações de serviços e lojas
Por PedraX

Placas-mãe
Por Kawan Pereira

Blog
Por Gabriel Torres

Podcast CdH
Por Gabriel Torres

Podcast CdH
Por Gabriel Torres

Podcast CdH
Por Gabriel Torres

Podcast CdH
Por Gabriel Torres

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas comunidades sobre tecnologia do Brasil. Leia mais
Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais
Clube do Hardware Powered by Invision Community
 

EBOOK GRÁTIS!

source

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

Suporte no Whatsapp
💬 Precisa de ajuda?
Studio Live Code
Olá 👋
Podemos te ajudar?
Studio Live Code Gostaríamos de mostrar notificações sobre as últimas notícias e atualizações.
Dismiss
Allow Notifications