miércoles, 13 de febrero de 2013

Añadir texto por medio del método append()


El métod append() nos permite añadir texto al final del que ya existe. El método text() los sustituye, pero append() lo anexa. También puede anezar a cualquier elemento de la página, por ejemplo a una lista, ya sea ordenada o sin orden.

<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
<script src="jquery.js">
</script>
<script>
var i = 0;
var ii = 0;
var poema = new Array()
poema.push("EN EL AGUA CLARA");
poema.push("QUE BROTA EN LA FUENTE,");
poema.push("UN LINDO PESCADO");
poema.push("SALE DE REPENTE");
poema.push("-LINDO PESCADITO,");
poema.push("¿NO QUIERES VENIR");
poema.push("A JUGAR CON MI ARO?");
poema.push("VAMOS AL JARDIN");
$(document).ready(function(){
  $("#btn1").click(function(){
    $("p").append(poema[i]+"<br>");
    i++;
  });

  $("#btn2").click(function(){
    $("ol").append("<li>"+poema[ii]+"</li>");
    ii++;
  });
});
</script>
</head>

<body>
<button id="btn1">Añade texto</button>
<button id="btn2">Aumenta la lista ordenada</button>
<p></p>
<ol></ol>
</body>
</html>


Ejemplo: http://pacoarce.com/jQuery/Append.html
Curso completo: https://www.udemy.com/jquery-y-mobile/

No hay comentarios:

Publicar un comentario