Hola. Tengo un gran problema. Tengo un ejercicio. Tengo una lista de labels dentro y cada vez que oprimo un botón se tienen que cambiar por inputs.
Para poder Editar. Pero no me sale. He usado replaceChild, removechild, pero hay algo que no sé.
Tengo que usar traversing y los selectores.
En el HTML
Código HTML :
<body> <div class="container"> <div class="row"> <div class="col-md-12"> <h1>Practica 1</h1> </div> </div> <div class="row"> <div class="col-md-6"> <ul id="ul"> <li><label for="">Escribir algo</label></li> <li><label for="">Escribir algo</label></li> <li><label for="">Escribir algo</label></li> <li><label for="">Escribir algo</label></li> </ul> <button type="button" id="btnEditar">Editar</button> </div> </div> </div> <script src="js/logica.js"></script> </body>
En js
Código Javascript :
var editar = document.querySelector('#btnEditar'); //Onclick editar.onclick = editarWeb; function editarWeb (){ var ul = document.getElementById('ul'); var lis = document.getElementsByTagName('li'); //create var textbox = document.createElement('input'); for (var i = 0; i < lis.length; ++i) {//todos los label var labels= lis[0].querySelectorAll('label'); console.log(labels); } console.log(lis); }
Gracias espero puedan ayudarme