Jump to content
Fórum Script Brasil
  • 0

Substituir um paragrafo utilizando getElementById e onclick


danielnmelo
 Share

Question

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 to comment
Share on other sites

2 answers to this question

Recommended Posts

  • 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;
}

 

Edited by wootzor
Link to comment
Share on other 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 to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

  • Forum Statistics

    • Total Topics
      149.6k
    • Total Posts
      646.2k
×
×
  • Create New...