SoloCodigo

Programación Web y Scripting => JavaScript => Mensaje iniciado por: nicoalv1984 en Sábado 18 de Diciembre de 2010, 15:02

Título: BOrrar un nodo de texto
Publicado por: nicoalv1984 en Sábado 18 de Diciembre de 2010, 15:02
hOla a todos...tengo el siguiente codio q agrego nodos o borro:
<html>
<body>
<script language="JavaScript">
var contador=1;
function function1() {
    var m = contador++;
    var n = document.createElement("li");
    n.appendChild(document.createTextNode(m));
    document.getElementById("myList").appendChild(n);
//contador++;
}

function eliminar()
{
 
  if (myList.hasChildNodes())
  {
    myList.removeChild(myList.lastChild);;

  }
}
   
</script>
<ul id="myList">
   <li>1</li>
   <li>2</li>
   <li>3</li>

   
</ul>
<input type="button" value="Add list item" onClick="function1();">
<input type="button" value="eliminar" onClick="eliminar()">
</body>
</html>
Lo q quisiera hacer es por es insertar hasta 6 nodos de textos, si inserto mas no dejar q se inserten mas de 6 nodos
Título: Re: BOrrar un nodo de texto
Publicado por: fonsi3 en Sábado 18 de Diciembre de 2010, 22:58
Hola, mira aqui te hice uno, fijate que he utilizado la propiedad innerHTML, que es mucho mas mejor de usar que createTextNode()

Código: Text
  1. <html>
  2.     <head></head>
  3.     <body>
  4.         <ul id="myList">
  5.         </ul>
  6.         <input type="button" value="Add" id="addItem">
  7.         <input type="button" value="Remove" id="removeItem">
  8.     </body>
  9. </html>
  10. <script>
  11.  
  12.     var myList = document.getElementById( 'myList' );
  13.     var addItem = document.getElementById( 'addItem' );
  14.     var removeItem = document.getElementById( 'removeItem' );
  15.     var count = 1;
  16.    
  17.     addItem.onclick = function() {
  18.         var item = document.createElement( 'li' );
  19.         item.innerHTML = count;
  20.         count += 1;
  21.         myList.appendChild( item );
  22.     };
  23.    
  24.     removeItem.onclick = function() {
  25.  
  26.         if( allItems.length ) {
  27.             var lastItem = allItems[allItems.length-1];
  28.             myList.removeChild( lastItem );
  29.             count -= 1;
  30.             if( !count ) {
  31.                 count = 1;
  32.             }
  33.         }
  34.     };
  35.    
  36. </script>
  37.  

Descargate Firefug, es una excelente herramienta para debuggear javascript.
Título: Re: BOrrar un nodo de texto
Publicado por: nicoalv1984 en Sábado 18 de Diciembre de 2010, 23:18
HOla Experto he probado su codigo , yo inserto varias nodos  con add (funciton)  y borro con revome (function) y me borra todos, yo quisiera saber si se puede poner un tope para borrar y luego q no te deje borrar mas nodos insertado, se podra hacer o no? Gracias.....
Título: Re: BOrrar un nodo de texto
Publicado por: fonsi3 en Domingo 19 de Diciembre de 2010, 00:10
Aqui le hecho una modifacion pa que solo se pueda insertar 6 nodos, es sencillo solo tienes que controlar cuantos <li> posee el <ul>.

Código: Text
  1. <html>
  2.     <head></head>
  3.     <body>
  4.         <ul id="myList">
  5.         </ul>
  6.         <input type="button" value="Add" id="addItem">
  7.         <input type="button" value="Remove" id="removeItem">
  8.     </body>
  9. </html>
  10. <script>
  11.  
  12.     var myList = document.getElementById( 'myList' );
  13.     var addItem = document.getElementById( 'addItem' );
  14.     var removeItem = document.getElementById( 'removeItem' );
  15.     var allItems = myList.getElementsByTagName( 'li' );
  16.     var count = 1;
  17.     var limit = 6;
  18.    
  19.     addItem.onclick = function() {
  20.         if( allItems.length < limit ) {
  21.             var item = document.createElement( 'li' );
  22.             item.innerHTML = count;
  23.             count += 1;
  24.             myList.appendChild( item );
  25.         }
  26.     };
  27.    
  28.     removeItem.onclick = function() {
  29.    
  30.         if( allItems.length ) {
  31.             var lastItem = allItems[allItems.length-1];
  32.             myList.removeChild( lastItem );
  33.             count -= 1;
  34.             if( !count ) {
  35.                 count = 1;
  36.             }
  37.         }
  38.     };
  39.    
  40.    
  41. </script>
  42.  
Título: Re: BOrrar un nodo de texto
Publicado por: nicoalv1984 en Lunes 20 de Diciembre de 2010, 14:16
Ok Gracias. Experto.