Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

console.log(document): como exibir no console do navegador apenas o código HTML em si

Olá pessoal!

Na transcrição (texto) sobre Query Selector, o resultado do código "console.log(document)" é:

#document
    <!DOCTYPE html>
    <html lang="pt-br">
        <head>...</head>
        <body>...</body>
    </html>

Porém, para mim, este mesmo código exibe no console do navegador (firefox) um retorno gigante, com várias propriedades, valores, exemplo:

HTMLDocument file:..
    URL: "file:..."
    activeElement: <body>
    alinkColor: ""
    all: HTMLAllCollection { 0: html, 1: head, 2: meta, … }
    anchors: HTMLCollection { length: 0 }
    applets: HTMLCollection { length: 0 }
    baseURI: "file:..."
    bgColor: ""
    body: <body>
    characterSet: "UTF-8"

    ... CONTINUACAO DO RESULTADO

Dúvida: como exibir no console do navegador apenas o código HTML em si, sem todas estas propriedades? Devo setar alguma propriedade no navegador, devo utilizar alguma propriedade específica da variável document, etc?

Desde já obrigado! Atte., Elías

3 respostas

Oi Elías, então, essa é uma diferença entre os navegadores mesmo. O Chrome vai mostrar de um jeito e o Firefox de outro.

O console tem vários métodos além do log, mas não conheço uma forma de escrever apenas o texto do HTML sem as propriedades.

Documentação do console: https://developer.mozilla.org/pt-BR/docs/Web/API/Console

solução!

Fala Elías, tudo bom?

Como o Wanderson falou, cada navegador tem suas particularidades. Isso acontece principalmente pelo fato de que o elemento document é um objeto! E esse tem diversas propriedades e métodos, você pode dar uma olhada clicando aqui

Agora, se você deseja ter todo o conteúdo do HTML aparecendo no console, você consegue utilizando o código abaixo:

console.log(document.documentElement.innerHTML);

documentElement retorna o elemento raiz do arquivo, no nosso caso, a tag <html>.

Espero ter ajudado!

Abraços e bons estudos!

Wanderson e Paulo, obrigado pelo retorno!

Pena que só possível marcar uma resposta como solução, porque neste casos elas se complementam.

Valeu!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software