Procurando um exemplo simples de JavaScript que atualize o DOM

StackOverflow https://stackoverflow.com/questions/44190

  •  09-06-2019
  •  | 
  •  

Pergunta

Estou procurando um exemplo simples de JavaScript que atualize o DOM.
Alguma sugestão?

Foi útil?

Solução

Aqui está um pequeno exemplo de javascript puro.Suponha que você tenha uma div com o id “maincontent”.

var newnode = document.createTextNode('Here is some text.');
document.getElementById('maincontent').appendChild(newnode);

Claro, as coisas são muito mais fáceis (especialmente quando você quer fazer coisas mais complicadas) com jQuery.

Outras dicas

@Ravi

Aqui está um exemplo funcional do seu código

<html>
    <head>
    <title>Font Detect please</title>

    <script src="prototype.js" type="text/javascript"></script>
    <script type="text/javascript">
        function changeTD()
        {
            $('Myanmar3').innerHTML = 'False';         
        }
    </script>
    </head>
    <body>              

        <table border="1">
        <tr><td>Font</td><td>Installed</td></tr>
        <tr><td>Myanmar3</td><td id="Myanmar3">True</td></tr>
        </table>        

        <a href="javascript:void(0);" onclick="changeTD();">Click Me</a>

    </body>
</html>

Você notará que adicionei um pequeno link no qual você deve clicar para realmente fazer a alteração.Achei que isso poderia facilitar o teste de verdade.

Acredito que este tutorial sobre jQuery tenha um exemplo que pode te ajudar: http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery

Uma pergunta mais específica pode fornecer resultados mais úteis, mas aqui está um par simples de trechos que mostra e posteriormente atualiza o texto em um elemento de contêiner de status.

// give some visual cue that you're waiting
container.appendChild( document.createTextNode( "Getting stuff from remote server..." ) );

// then later...        
// update request status    
container.replaceChild( document.createTextNode( "Done." ), container.firstChild );


<html>
    <head>
    <title>Font Detect please</title>

    <script src="prototype.js" type="text/javascript"></script>
    <script type="text/javascript">
        $('Myanmar3').update('False');         
        $('Myanmar3').innerHTML;        
    </script>
    </head>
    <body>      

        <table border="1">
        <tr><td>Font</td><td>Installed</td></tr>
        <tr><td>Myanmar3</td><td id=Myanmar3>True</td></tr>
        </table>        

    </body>
</html>

Tenho um código simples como esse acima e estou tentando alterar o resultado True para false via Javascript usando Prototype.O que posso estar fazendo de errado?

Editar:Entendi.Eu não liguei.:D

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top