Ir para conteúdo
Fórum Script Brasil
  • 0

Substituir um paragrafo utilizando getElementById e onclick


danielnmelo

Pergunta

Pessoal, estou querendo substituir um texto por outro que o usuário vai decidir. Por isso coloquei um ID em cada "p" porém já tentei referenciar ele de várias formas e sempre dá errado. A única forma de fazer o código executar algo é se eu deixar uma frase já pronta para ele substituir. 

 

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Teste</title>
    
    <script>
        function funcao() {
        document.getElementById("selecionar").innerHTML = "Quero colocar o ID do p aqui ";
}    
    </script>
</head>
<body>
    <div><h1>selecionar</h1><p id="selecionar" >Aqui deve vir o texto selecionado<p>
    <h1>Cidades</h1>
    <ol>
        <li>
            <p id="p1" onclick="funcao()">Porto Alegre</p>
        </li>
        <li>
            <p id="p2" onclick="funcao()">São Paulo</p>
        </li>
        <li>
            <p id="p3" onclick="funcao()">Rio de Janeiro</p>
        </li>
    </ol>
</body>
</html>

Link para o comentário
Compartilhar em outros sites

2 respostass a esta questão

Posts Recomendados

  • 0

Pretendes mostrar o ID ou o texto do parágrafo?

Assim consegues mostrar o texto do elemento que foi clicado:

<body>
  <div>
    <h1>selecionar</h1>
    <p id="selecionar">Aqui deve vir o texto selecionado</p>
    <h1>Cidades</h1>
    <ol>
      <li>
        <p id="p1" onclick="funcao(this)">Porto Alegre</p>
      </li>
      <li>
        <p id="p2" onclick="funcao(this)">São Paulo</p>
      </li>
      <li>
        <p id="p3" onclick="funcao(this)">Rio de Janeiro</p>
      </li>
      </ol>
  </div>
</body>
function funcao(elemento) {
  document.getElementById("selecionar").innerHTML = elemento.innerHTML;
}

 

Editado por wootzor
Link para o comentário
Compartilhar em outros sites

  • 0

Obrigado pela ajuda wootzor...

 

Consegui resolver de uma maneira mais fácil, sem colocar ID nos <p>...

 

Segue abaixo o código

 

<!doctype html>
  <html lang="en">
  <head>
  <meta charset="UTF-8">
  <title>Teste</title>
   
  <script>
  function funcao(p) {
  document.getElementById("selecionar").innerHTML = p.innerHTML;
  }
  </script>
  </head>
  <body>
  <div><h1>selecionar</h1><p id="selecionar" >Aqui deve vir o texto selecionado<p>
  <h1>Cidades</h1>
  <ol>
  <li>
  <p onclick="funcao(this)">Porto Alegre</p>
  </li>
  <li>
  <p onclick="funcao(this)">São Paulo</p>
  </li>
  <li>
  <p onclick="funcao(this)">Rio de Janeiro</p>
  </li>
  </ol>
  </body>
  </html>
Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152k
    • Posts
      651,8k
×
×
  • Criar Novo...