document.write | JavaScript e HTML: desenvolva um jogo e pratique lógica de programação

eu sempre preciso usar o document.write se eu quiser escrever algo dentro do script?

por exemplo eu quero por uma divisao usando hifen no code abaixo.

<meta charset="UTF-8">

<script>
    var ano=2021;
    document.write("Max tem " + (ano - 1975) + " anos");
    document.write("<br>");
    document.write("Joao tem " + (ano - 2016) + " anos");
    document.write("<br>");
    document.write("Barney tem " + (ano - 1989) + " anos");
   document.write("<br><br><br>");

 ----------------------------------------------------
    ano=2020

     document.write("Max tem " + (ano - 1975) + " anos");
    document.write("<br>");
    document.write("Joao tem " + (ano - 2016) + " anos");
    document.write("<br>");
    document.write("Barney tem " + (ano - 1989) + " anos");



</script>

neste caso so daria certo usando a função "document.write", mas existe outra forma? sem ter que usar essa função. apenas escrever, igual como é no html

Olá Vinicius tudo bem ?

Eu estava observando seu código e resolvi reescreve-lo de uma forma que ele fique mais limpo , apenas utilizando funções.

Antes de tudo respondendo sua pergunta no javascript o document.write é uma função do javascript que escreve no html da página. Basicamente, ele pega uma página e sobrescreve seu conteúdo, o document.write é o mais utilizado para fazer a apresentação de texto dentro das tags scripts.

Mas é possível trabalharmos com a funções para evitar de ficar escrevendo toda hora o document.write

Iniciando o código eu observei que além de você toda hora escrever o document.write está pulando linhas pois bem :

 function pulaLinha(){
        document.write("<br><br>");
    }

Criei essa função pulaLinha() que o único objetivo dela é pular 2 linhas ou seja quando você quiser pular linha é só você invocar a função pulaLinha() ao invés de escrever repetidamente o document.write("<br>") .

function mostra(frase){
        document.write(frase)
        pulaLinha()
    }

Logo após eu criei uma função mostra() que recebe como parâmetro o argumento frase , do qual seu objetivo é apresentar na tela as frases descrita no seu código , ou seja o document.write vai receber o parâmetro apresentado na função e quando você invocar a função mostra em alguma frase do seu código ele vai exibir os textos, logo em seguida veja que eu invoquei a função pulaLinha() ou seja a cada frase que você chamar a função automaticamente ele vai pular 2 linhas como está descrito na função anterior.

O código então ficará assim :

<meta charset="UTF-8">

<script>
    function pulaLinha(){
        document.write("<br><br>");
    }

    function mostra(frase){
        document.write(frase)
        pulaLinha()
    }


    var ano = 2021;
     mostra("Max tem " + (ano - 1975) + " anos");
     mostra("Joao tem " + (ano - 2016) + " anos");
     mostra("Barney tem " + (ano - 1989) + " anos");


    document.write("<hr>")

    ano = 2020

    mostra("Max tem " + (ano - 1975) + " anos");
    mostra("Joao tem " + (ano - 2016) + " anos");
    mostra("Barney tem " + (ano - 1989) + " anos");



</script>

Observe que na linha 20 :

document.write("<hr>")

eu utilizei novamente o document.write que recebe o parâmetro "<hr>" apenas para traçar uma linha na tela para fazer essa separação que você fez no seu código. Observe que utilizando as funções (function) o seu código fica mais limpo e menos repetitivo.

Espero que tenha ajudado , e que você compreenda oque foi feito aqui. =)

Qualquer dúvida só mandar aqui no fórum que estaremos a disposição para te ajudar. =)

Abraços e bons estudos.

Mergulhe em programação