Jump to content

Como acessar o Dom?

edenilson carmo

Por edenilson carmo
em JavaScript

 Compartilhar

Postagens Recomendadas

edenilson carmo

edenilson carmo

Postado
Postado (editado)

Estou com dificuldades para acessar o Dom no Visual Studio Code.

Instalei todas as extensões necessárias, porém não consigo ter acesso ao Browser. O que me parece é que o Watch in Chrome não está mais em funcionamento.

Será que alguém conseguiria me ajudar? estou começando na área agora.

<!DOCTYPE html>

<html lang="pt-br">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Primeiro passos com Dom</title>

   

   <style>

   

       body {

        background-color: rgb(72, 68, 199);

        color:white;

        font: 18pt arial;

                  }

      </style>

 

</head>

<body>

    <h1>Iniciando o estudo em Dom</h1>

    <p>Aqui vai o resultdo</p>

    <p>Aprendendo a usar o  <strong>Dom</strong> em javascript.</p>

    <div>clique em mim</div>

    <script>

        var p1 = window.documentElementsByTagName('p') [0]  

        window.document.write( 'Está escrito assim' + p1.inerTexto)

    </script>


 

   

</body>

</html>

 

index.html

Editado por edenilson carmo
  • Curtir 1
Tiago Neves

Tiago Neves

Postado
Postado

Fala, @edenilson carmo. Infelizmente, essa funcionalidade foi descontinuada em 2021.

Mas não se preocupe! Existem alternativas eficazes para você continuar aprendendo e praticando o DOM:

  • Extensões para Depuração:

Live Server: Uma das extensões mais populares para o Visual Studio Code, o Live Server permite iniciar um servidor HTTP local com apenas um clique. Isso facilita a visualização das alterações do DOM em um navegador real.

Browser Preview: Outra ótima opção, a extensão Browser Preview oferece uma pré-visualização integrada do navegador dentro do próprio Visual Studio Code. Ideal para testes rápidos e ajustes no código.

  • Ferramentas de Desenvolvedor do Navegador:

Inspeção do Elemento: Utilize as ferramentas de desenvolvedor do seu navegador (F12 no Chrome, Firefox e Edge) para inspecionar o DOM e testar seus scripts. Essa ferramenta oferece informações detalhadas sobre os elementos da página e permite modificar o código HTML e CSS diretamente no navegador.

Console do Navegador: O console do navegador (acessível pela guia "Console" nas ferramentas de desenvolvedor) é essencial para registrar mensagens de log, testar funções JavaScript e interagir com o DOM.

  • Ajudou! 1
edenilson carmo

edenilson carmo

Postado
  • Autor(a)
Postado
3 horas atrás, Tiago Neves disse:

Fala, @edenilson carmo. Infelizmente, essa funcionalidade foi descontinuada em 2021.

Mas não se preocupe! Existem alternativas eficazes para você continuar aprendendo e praticando o DOM:

  • Extensões para Depuração:

Live Server: Uma das extensões mais populares para o Visual Studio Code, o Live Server permite iniciar um servidor HTTP local com apenas um clique. Isso facilita a visualização das alterações do DOM em um navegador real.

Browser Preview: Outra ótima opção, a extensão Browser Preview oferece uma pré-visualização integrada do navegador dentro do próprio Visual Studio Code. Ideal para testes rápidos e ajustes no código.

  • Ferramentas de Desenvolvedor do Navegador:

Inspeção do Elemento: Utilize as ferramentas de desenvolvedor do seu navegador (F12 no Chrome, Firefox e Edge) para inspecionar o DOM e testar seus scripts. Essa ferramenta oferece informações detalhadas sobre os elementos da página e permite modificar o código HTML e CSS diretamente no navegador.

Console do Navegador: O console do navegador (acessível pela guia "Console" nas ferramentas de desenvolvedor) é essencial para registrar mensagens de log, testar funções JavaScript e interagir com o DOM.

Tiago, muito obrigado!

Eu já estalei o Liver Sever e mesmo assim quando clico na opção em cima do index.html, não abre e pedi para abrir o GitHub Coopiloto, porém ele já está instalado. Será que fiz alguma coisa errada na hora de configurar?

  • Curtir 1

Crie uma conta ou entre para comentar 😀

Você precisa ser um membro para deixar um comentário.

Crie a sua conta

Participe da nossa comunidade, crie sua conta.
É bem rápido!

Criar minha conta agora

Entrar

Você já tem uma conta?
Faça o login agora.

Entrar agora
 Compartilhar
Ir para a listagem de tópicos


×
×
  • Create New...