Entendido.

Este sitio utiliza cookies para analizar la navegación. Si continúa navegando se entiende que acepta su uso. Ver más detalles.";

Logo

Aprende Web

Crea y diseña tus sitios en la Web.

Manual de MooTools (I Básico)

MooTools: la librería más completa para trabajar fácilmente con javascript.


Y ahora tambien aprende a programar en C++ con Aprende Web C++

logo rss RSS. Suscribir canal.

Buscar en Aprende Web

Traducir página

Visita nuestro blog:

bolg.aprende-web.net

y entérate de las novedades o deja un comentario.

Dudas y sugerencias:

aprendeweb@aprende-web.net





Sobre ésta página

Ültima modificación: 29-01-2016.

Visitas este mes: 25

Visitas el mes pasado: 15

logo
WEB-GRAFÍA

Mi agradecimiento a las siguientes páginas Web. en las cuales me he basado para la elaboración de este manual:


Manual mootools : desarrollo web
Desarrollo Web
Manual de MooTools
lawebera.es
The MooToorial
mootoorial.com
Mootools para principiantes
brainbol.com
docs/core/ página oficial mootools
mootools.net

Donativos

Si este sitio te parece interesante puedes contribuir con una pequeña aportación.




MooTools (XI)

Cadenas y números

imagen mootools

Introducción

Javascript tiene unos cuantos métodos para trabajar con las cadenas de texto (clase String), y con los números (clase Number). Mootools incorpora también algunos métodos propios. Los veremos en esta página:


Métodos para cadenas


string.test()

El método .text comprueba si la cadena se ajusta a una expresión regular. La expresión regular la pasamos como argumento. El resultado es true o false.

Pongamos como ejemplo un input que pide un email, y queremos comprobar si esta bien escrito:

Escribe un email:

El ejemplo anterior tiene el siguiente código:

<p>Escribe un email:<input id="email" type="text"/></p>
<p><input type="button" value="comprobar"
onclick="alert($('email').get('value').test(/^[\w]+@{1}[\w]+\.[a-z]{2,3}$/))" /></p>

Observa cómo al método test le pasamos como argumento una expresión regular que comprueba si lo escrito dentro del input es un email. El resultado lo sacamos dentro de una ventana alert.


string.contains()

Este método comprueba si una cadena (pasada en el argumento) está contenida dentro de la cadena principal. El resultado es true o false.

Veamos ahora un ejemplo en funcionamiento, y después mostramos el código:

En un lugar de la Mancha de cuyo nombre no quiero acordarme no ha mucho tiempo que vivía un hidalgo de los de lanza en astillero, adarga antigua, rocín flaco y galgo corredor.

Escribe un trozo del texto anterior (o no):

Este ejemplo lo hemos hecho con el siguiente código:

<p id="txt1" style="color: blue">En un lugar de la Mancha de cuyo nombre no quiero acordarme
    no ha mucho tiempo que vivía un hidalgo de los de lanza en astillero, adarga antigua, 
    rocín flaco y galgo corredor. </p>
<p>Escribe un trozo del texto anterior (o no):
    <input id="txt2" type="text"/></p>
<p><input type="button" value="comprobar" 
     onclick="alert($('txt1').get('html').contains($('txt2').get('value')))" /></p>

Observa cómo en la última línea, dentro del onclick utilizamos el método contains() para comprobar si lo que hemos escrito dentro del input coincide con parte de lo escrito en el párrafo anterior.


string.toInt()

Convierte la cadena de texto en un número entero. Para ello los primeros caracteres de la cadena deben ser cifras que representan a un número. De no ser así devuelve NaN.

a="10".toInt();// a=10
a="10px".toInt();// a=10
a="num10".toInt();// a=NaN
a="10.25".toInt();// a=10
a="-10.25".toInt();// a=-10


string.toFloat()

Es como el anterior, sólo que aquí la cadena se convierte en un número real que admite decimales.


string.capitalize()

Convierte la primera letra de cada palabra a mayúsculas. Este método no tiene argumentos.

saludo="hola mundo".capitalize(); // saludo="Hola Mundo"


string.rgbToHex()

Convierte una cadena consistente en un código de color en rgb decimal a una cadena consistente en código de color hexadecimal:

color="rgb(17,34,51)".rgbToHex(); // color="#112233"

string.rgbToRgb()

Convierte una cadena consistente en un código de color en hexadecimal a una cadena consistente en código de color rgb decimal:

color="#112233".hexToRgb(); // color="rgb(17,34,51)"


string.trim()

Elimina los espacios en blanco que hay delante o detras de una cadena:

saludo=" hola mundo ".trim(); // saludo="hola mundo"


Métodos para números

El objeto Number tiene ya unos cuantos métodos en javascript. Mootools añade además algunos métodos propios:


Number.limit()

Acota un número entre dos valores, minimo y máximo, los cuales los pasamos como argumentos:

n.limit(min,max);

Aquí n, min y max son números. si "n" es mayor o menor que el número indicado tomará el valor del maximo o del mínimo. Si está entre los límites indicados seguirá con el valor que tenía antes.


Number.round()

Redondea el valor del número indicado al más proximo. En el paréntesis se puede indicar el número de decimales que queremos en el redondeo. Si el número indicado en el paréntisis es negativo lo redondea a múltiplos de 10 (ceros al final del número). Si no se indica nada en el paréntesis, se redondea a números enteros.

(532.263).round();//devuelve 532
(532.263).round(1);//devuelve 532.3
(532.263).round(-1);//devuelve 530


Number.times()

Tabla del 7

Crea un bucle que se repite el número de veces indicado por el número. Como argumento le pasamos una función, la cual es el código que se ejecuta dentro del bucle. La función admite un argumento, que será el número de la repetición.

Para hacer el ejemplo de la derecha primero hemos puesto un div:

<div id="capa1">
<h2>Tabla del 7</h2>
</div>

Y luego le hemos añádido el siguiente codigo, en el que incluimos un bucle con .times():

(11).times(function(n){
linea=new Element("p",{"html":"7 x "+n+" = "+n*7});
linea.inject($("capa1"),"bottom");
});

Observa como la variable n marca la iteración del bucle. Esta siempre empieza a contar por el número 0, y va aumentando una unidad en cada vuelta. El bucle se repite el número de veces que indicamos (11).






En la siguiente página veremos el método hash de mootools, con el que podemos hacer algunas cosas.

Método hash



Manual de Mootools (I Básico)

Anterior siguiente ... Siguiente siguiente


imprimir esta página

Página creada por ANYELGUTI.

Sugerencias: aprendeweb@aprende-web.net. Envia un manda un correo

Visita nuestro blog par saber en qué estamos trabajando: Aprende Web Blog

Más sobre anyelguti en http://anyelguti.16mb.com