2.2 Introduciendo Texto usando el método .text().
En alguna ocasiones será necesario introducir texto dentro de un determinado elemento, ya sea que queramos colocar un texto totalmente nuevo, o bien, borrar el texto actual y poner un texto nuevo.Para todo lo anterior podemos usar el  método .text() de Jquery.Ahora para poder ilustrar un poco mejor su uso, supongamos que tenemos un div con la clase “contenedorTexto”, el cual tiene una determinada frase y deseamos que al presionar un botón con la clase “cambiarTexto”  el texto del div cambie, el código HTML sería el siguiente:
<div class=”contenedorTexto”>Este texto cambia al presionar el botón en la parte inferior</div>
<form>
<input type=”button” value=”Presiona aquí y el texto cambia” class=”cambiarTexto”/>
</form>

El código de Jquery sería el siguiente:
$(document).ready(function(){
$(“.cambiarTexto”).click(function(){
              $(“.contenedorTexto”).text(“”).text(“Este es un texto Nuevo!!!!”);
     });
});

El código consiste en las siguientes partes:

  • La primera parte $(document).ready(function(){}); es para indicar que el código javascrit se ejecutará hasta que se termine de cargar todo el código HTML.
  • La segunda parte $(“.cambiarTexto”).click(function(){}); sirve para indicar el script a ejecutar cuando se haga click sobre el botón.
  • La última parte  $(“.contenedorTexto”).text(“”).text(“Este es un texto Nuevo!!!!”);  sirve para seleccionar el div con la clase “contenedorTexto” y después limpiar el texto usando .text(“”), y finalmente agregar un texto nuevo usando text(“Este es un texto Nuevo!!!);,se bede observar que es posible encadenar métodos, simplemente poniéndolos uno después de otro separados por puntos, es este caso .text(“”).text(“Este es un texto nuevo!!!”).

 

Introduciendo texto usando el método .text().
2.2

Copyright © 2013 LaWebDeRay
correo:lawebderay@gmail.com

Free Web Hosting