1

Tengo el siguiente codigo...

HTML


  <ul>
    <li>Muestra 1</li>
    <li>Muestra 2</li>
    <li>Muestra 3</li>
    <li>Muestra 4</li>
    <li>Muestra 5</li>
    <li>Muestra 6</li>
  </ul>
  <button onclick="promptTexto()">Clic aquí</button>

JS

function promptTexto(){
    var texto = document.createTextNode(prompt("Texto: "));
    var nuevoLi = document.createElement("li");
    nuevoLi.appendChild(texto);
    document.getElementsByTagName("ul")[0].innerHTML += nuevoLi;
}

Lo que quiero és que puedas añadir un elemento <li> al clicar el botón. En cambio, en vez de añadir un <li>, pone [object HTMLLIElement]. He probado poniendo document.getElementsByTagName("ul")[0].innerHTML += nuevoLi.textContent; pero sólo me añade el texto, sin la etiqueta <li>.

No he podido encontrar nada y llevo un buen rato buscando. Cualquier ayuda es bienvenida.

1 respuesta 1

5

Hay muchas formas de hacerlo, yo te aporto una la cual creo que es de las más sencillas.

Primero añade un id a tu ul en tu archivo .html:

  <ul id="MiLista">
    <li>Muestra 1</li>
    <li>Muestra 2</li>
    <li>Muestra 3</li>
    <li>Muestra 4</li>
    <li>Muestra 5</li>
    <li>Muestra 6</li>
  </ul>

Y en el archivo .js:

function promptTexto(){
  var nuevoLi = document.createElement("LI");
  var texto = document.createTextNode(prompt("Texto: "));;
  nuevoLi.appendChild(texto);
  document.getElementById("MiLista").appendChild(nuevoLi);
}

Llama a tu función de tal forma que cree el elemento li, pregunte por el texto, asigne el texto al li y lo inserte en el elemento con id "MiLista", el cual en este caso, hace referencia a tu ul.

Aquí tienes un ejemplo del funcionamiento: Ejemplo.

Cualquier duda no dudes en comentármela.

2
  • 1
    Justo lo que buscaba, gracias :p
    – MrJant
    Commented el 18 nov. 2021 a las 7:37
  • De nada! A ti :) Commented el 18 nov. 2021 a las 8:07

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.