Mostrar Mensajes

Esta sección te permite ver todos los posts escritos por este usuario. Ten en cuenta que sólo puedes ver los posts escritos en zonas a las que tienes acceso en este momento.


Temas - bermartinv

Páginas: 1 [2] 3 4 5
21
Adjunto mi solución para el ejercicio CU00821B del tutorial básico de programación web con PHP.

http://cursophp.byethost14.com/aprenderaprogramar/ejercicioCU00821B.php
Código: [Seleccionar]
<!DOCTYPE html>
<html>
    <head>
    <meta charset="utf-8">
</head>
<body>
<?php

$varaible 
'Didáctica y divulgación de la programación';
    
$br '<br/>';

$palabra1 substr($varaible,010);

$palabra2 substr($varaible111);

$palabra3 substr($varaible1312);

$palabra4 substr($varaible253);

$palabra5 substr($varaible283);

$palabra6 substr($varaible32);

echo 
"Las palabras primera, tercera y sexta son: $palabra1".', '.$palabra3.', '.$palabra6;
    
echo 
$br;

echo 
"La palabra primera es $palabra1"." y tiene ".(strlen($palabra1)-1)." caracteres, la palabra tercera es $palabra3 "."y tiene ".(strlen($palabra3)-1)." caracteres. La palabra sexta es $palabra6 "." y tiene ".(strlen($palabra6)-1)." caracteres.";
    
echo 
$br;
    
?>

   
</body>
</html>

Saludos.

22
Mis resultados para este tema.

Ejercicio 1.

Citar
//Ejemplo de uso switch PHP aprenderaprogramar.com

        switch ($mes) {

            case 1:

            echo ("El mes es enero");

            break;

            case 2: echo ("El mes es febrero"); break;

            case 10: echo ("El mes es octubre"); break;

            default: echo ("El mes no es enero, febrero ni octubre"); break;

        }

 

Responde a las siguientes cuestiones:

a) ¿Qué es lo que hace este código?
Analiza el valor que tiene la variable mes , si su valor es 1 escribe 'El mes es enero', si su valor es 2 escribe 'El mes es febrero', si su valor es 10 escribe 'El mes es octubre' y si no es ni 1, 2, 10 escribe 'El mes no es enero, febrero ni octubre'.
Citar
b) Completa el código de forma que añadas las etiquetas y definas el valor de $mes = 1. Sube el fichero al servidor y comprueba el resultado. ¿Cuál es el código completo? ¿Cuál es el resultado obtenido por pantalla?
http://cursophp.byethost14.com/switch_ejercicio1.php
Código: [Seleccionar]
<?php


 
//Ejemplo de uso switch PHP aprenderaprogramar.com
$mes 1;

        switch (
$mes) {

            case 
1:

            echo (
"El mes es enero");

            break;

            case 
2: echo ("El mes es febrero"); break;

            case 
10: echo ("El mes es octubre"); break;

            default: echo (
"El mes no es enero, febrero ni octubre"); break;

        }

?>
El resultado es 'El mes es enero'.

Ejercicio 2.
Citar
Considera estás desarrollando una web donde trabajas con tipos de motor (suponemos que se trata del tipo de motor de una bomba para mover fluidos). Define una variable $tipoMotor y asígnale valor 3. Los valores posibles son 1, 2, 3, 4. A través de un condicional switch haz lo siguiente:

a)      Si el tipo de motor es 0, mostrar un mensaje indicando “No hay establecido un valor definido para el tipo de bomba”.

b)      Si el tipo de motor es 1, mostrar un mensaje indicando “La bomba es una bomba de agua”.

c)       Si el tipo de motor es 2, mostrar un mensaje indicando “La bomba es una bomba de gasolina”.

d)      Si el tipo de motor es 3, mostrar un mensaje indicando “La bomba es una bomba de hormigón”.

e)      Si el tipo de motor es 4,mostrar un mensaje indicando “La bomba es una bomba de pasta alimenticia”.

f)       Si no se cumple ninguno de los valores anteriores mostrar el mensaje “No existe un valor válido para tipo de bomba”.

 

¿Cuál es el código completo? ¿Cuál es el resultado obtenido por pantalla?
http://cursophp.byethost14.com/switch_ejercicio2.php
Código: [Seleccionar]
<?php

$tipoMotor 
3;

switch (
$tipoMotor){
        
    case 
0
        echo 
'No hay establecido un valor definido para el tipo de bomba';
        break;
        
    case 
1:
        echo 
'La bomba es una bomba de agua';
        break;
        
    case 
2:
        echo 
'La bomba es una bomba de gasolina';
        break;
        
    case 
3:
        echo 
'La bomba es una bomba de hormigón';
        break;
        
    case 
4:
        echo 
'La bomba es una bomba de pasta alimenticia';
        break;
        
    default:
        echo 
'No existe un valor válido para tipo de bomba';
        
}

?>
El resultado obtenido es 'La bomba es una bomba de hormigón'.

Saludos.

23
Adjunto mis soluciones para este tema del curso básico de programación web con PHP.

Citar
EJERCICIO 1

Crea un código PHP donde crees las variables $primerNumero y $segundoNumero y asigna valor 8 al primer número y 5 al segundo número:

a) El resto de dividir el primer número entre 5.

b) El resultado de dividir el primer número entre el segundo.

c) El resultado de sumar los dos números.

Para comprobar si tu código y respuestas son correctas puedes consultar en los foros aprenderaprogramar.com.
http://cursophp.byethost14.com/operadores_aritmeticos_ejercicio1.php
Código: [Seleccionar]
<?php

$primerNumero 
8;

$segundoNumero 5;

$resultado '';

echo 
' La primera variable tiene de valor '; echo $primerNumero ; echo ' y la segunda '; echo $segundoNumero;

echo 
'<br/>';

echo 
'El resto de dividir '; echo $primerNumero; echo ' entre 5 es '; echo ($primerNumero%5);

echo 
'<br/>';

echo 
'El resultado de dividir '; echo $primerNumero; echo ' entre '; echo $segundoNumero; echo ' es '; echo ($primerNumero $segundoNumero);

echo 
'<br/>';

echo 
'El resultado de sumar las dos variables es '; echo $primerNumero; echo ' + '; echo $segundoNumero; echo ' = '; echo ($primerNumero $segundoNumero);

echo (
'<br/>');

?>


Citar
EJERCICIO 2

Crea un código PHP donde crees las variables $a y $b y usando los operadores adecuados haz que se muestren los siguientes mensajes por pantalla. Nota: para mantener los valores iniciales de las variables y poder volver a emplearlos usa variables auxiliares, por ejemplo $inicio = $a; te permitirá mantener en $inicio el valor original de $a y volver a recuperar el valor inicial de $a antes de hacer una nueva operación.

Mensajes a mostrar por pantalla:

Operadores de incremento

Valores iniciales: a = 4, b = 2

Operador ++ (anterior): ++a * b == 10

(Ahora el valor de a es: 5)

Operador ++ (posterior): a++ * b == 8

(Ahora el valor de a es: 5)

Operador -- (anterior): --a * b == 6

(Ahora el valor de a es: 3)

Operador -- (posterior): a-- * b == 8

(Ahora el valor de a es: 3)

 

Operadores de asignación compuestos

Valores iniciales: a = 4, b = 2

Asignación compuesta de suma: a += b equivale a = a + b

(Ahora el valor de a es: 6)

Asignación compuesta de resta: a -= b equivale a = a - b

(Ahora el valor de a es: 2)

Asignación compuesta de multiplicación: a *= b equivale a = a * b

(Ahora el valor de a es: 8 )

Asignación compuesta de división: a /= b equivale a = a / b

(Ahora el valor de a es: 2)

Asignación compuesta de módulo: a %= b equivale a = a % b

(Ahora el valor de a es: 0)
http://cursophp.byethost14.com/operadores_aritmeticos_ejercicio2.php
Código: [Seleccionar]
<?php

define 
('inicialA' 4);

define ('inicialB' 2);

echo 
'Los valores iniciales son a = '; echo inicialA ; echo ' y b = '; echo inicialB;

echo 
'<br/>';echo '<br/>';

echo 
'Operadores de incremento';echo '<br/>';
echo 
'----------------------------';echo '<br/>';

echo 
'1. ++a * b su resultado es '$A inicialA  ; echo (++$A inicialB); echo ' y ahora a vale '; echo $A;echo '<br/>';

echo 
'2. a++ * b su resultado es '$A inicialA ; echo ($A++ * inicialB); echo ' y ahora a vale '; echo $A ; echo '<br/>';

echo 
'3. --a * b su resultado es '$A inicialA ; echo (--$A inicialB); echo ' y ahora a vale '; echo $A ; echo '<br/>';

echo 
'4. a-- * b su resultado es '$A inicialA ; echo ($A-- * inicialB); echo ' y ahora a vale '; echo $A ; echo '<br/>';

echo 
'<br/>';echo '<br/>';

echo 
'Operadores de asignación compuestos';echo '<br/>';
echo 
'-------------------------------------------';echo '<br/>';

echo 
'1. a += b su resultado es '$A inicialA ; echo ( $A += inicialB ); echo ' que es equivalente a a + b = '; echo ($AinicialA inicialB); echo '<br/>';

echo 
'2. a -= b su resultado es '$A inicialA; echo ( $A -= inicialB ); echo ' que es equivalente a a - b = '; echo ($A inicialA inicialB);echo '<br/>';

echo 
'3. a *= b su resultado es '$A inicialA ; echo ( $A *= inicialB ); echo ' que es equivalente a a * b = '; echo ($A inicialA inicialB); echo '<br/>';

echo 
'4. a /= b su resultado es '$A inicialA ; echo ( $A /= inicialB ); echo ' que es equivalente a a / b = '; echo ($A inicialA inicialB); echo '<br/>';

echo 
'5. a %= b su resultado es '$A inicialA ; echo ( $A %= inicialB); echo ' que es equivalente a a % b = '; echo ($A inicialA inicialB);echo '<br/>';

?>


Saludos

24
Citar
Dadas las variables de tipo entero con valores $A = 5, $B = 3, $C = -12 indicar si la evaluación de estas expresiones daría como resultado verdadero o falso:

a) $A > 3                                                            b) $A > $C                                               c) $A < $C

d) $B < $C                                                          e) $B != $C                                               f) $A == 3

g) $A * $B == 15                                                h) $A * $B == -30                                      i) $C / $B < $A

j) $C / $B == -10                                                 k) $C / $B == -4                                         l) $A + $B + $C == 5

m) ($A+$B == 8 ) && ($A-$B == 2)                       n) ($A+$B == 8 ) || ($A-$B == 6)

o) $A > 3 && $B > 3 && $C < 3                            p) $A > 3 && $B >= 3 && $C < -3
He utilizado este ejercicio para repasar lo dado en el tema anterior. He usado el condicional ternario para comprobar lo verdadero y falso.

http://cursophp.byethost14.com/operadores_logicos.php

Código: [Seleccionar]
<?php

$A 
5$B 3$C = -12;
$respuesta ='';
// CONDICIONES

$A 3?  $respuesta 'El valor de A es mayor que 3':$respuesta 'El valor de A es menor que 3';

echo (
$respuesta);echo ('<br/>');

$A $C$respuesta 'La variable A es mayor que la variable C' $respuesta 'La variable A no es mayor que la variable C';

echo (
$respuesta);echo ('<br/>');

$A<$C$respuesta 'La variable A es menor que la variable C' $respuesta 'La variable A no es menor que la variable C';

echo (
$respuesta);echo ('<br/>');

$B $C$respuesta 'B es menor que C' $respuesta "B es mayor que C";

echo (
$respuesta);echo ('<br/>');

$B != $C $respuesta 'B es distinta a C' $respuesta 'B es igual a C';

echo (
$respuesta);echo ('<br/>');

$A == $respuesta 'El valor de A es 3' $respuesta 'El valor de A no es 3';

echo (
$respuesta);echo ('<br/>');

$A $B == 15 $respuesta = ('Multiplicar la variable A y B es igual 15') : $respuesta =('Multiplicar la variable A y B NO es igual 15');

echo (
$respuesta);echo ('<br/>');

$A $B == -30 $respuesta = ('EL resultado de multiplicar A y B es -30') : $respuesta = ('El resultado de multiplicar A y B es distinto a -30');

echo (
$respuesta);echo ('<br/>');

(
$A $B) < $A $respuesta = ('El resultado de dividir A entre B es menor a A') : $respuesta = ('El resultado de dividir A entre B no es menor a A');

echo (
$respuesta);echo ('<br/>');

(
$C $B )== -10 $respuesta 'El resultado de dividir C entre B es -10' $respuesta 'El resultado de dividir C entre B no es -10';

echo (
$respuesta);echo ('<br/>');

$C $B == -$respuesta 'El resultado de dividir C entre B es -4' $respuesta 'El resultado de dividir C entre B no es -4';

echo (
$respuesta);echo ('<br/>');

$A $B $C == $respuesta 'La suma de las variables A, B y C es 5 ' $respuesta 'La suma de las variables A, B y C no es 5';

echo (
$respuesta);echo ('<br/>');

(
$A $B == ) && ($A-$B == 2)? $respuesta 'A + B es 8 y A - B es 2' $respuesta 'No cumple ($A+$B == 8 ) && ($A-$B == 2)  ';

echo (
$respuesta);echo ('<br/>');

((
$A+$B == ) || ($A-$B == 6)) ? $respuesta 'A + B es 8 o A - B es 6' $respuesta 'No cumple ($A+$B == 8 ) || ($A-$B == 6)';

echo (
$respuesta);echo ('<br/>');

$A && $B && $C 3  $respuesta 'A es > 3 y B es > 3 y C es > 3' $respuesta 'No cumple $A > 3 && $B > 3 && $C < 3  ';

echo (
$respuesta);echo ('<br/>');

$A && $B >= && $C < -$respuesta 'A es > 3 y B es mayor o igual 3 y C es menor a -3' $respuesta 'No cumple $A > 3 && $B >= 3 && $C < -3';

echo (
$respuesta);echo ('<br/>');
?>

Cuando uso operaciones lógicas que son muy largas me ayuda mucho separar las operaciones con paréntesis. Con esto consigo ver de una manera más sencilla la posible solución de una operación lógica que sea muy larga.

Saludos.

25
Mis soluciones para el tema CU00817B.
Ejercicio 1.

Citar
Ejecuta este código y responde:

a) ¿Qué resultado se obtiene por pantalla?

b) Modifica el código sustituyendo el operador ternario por if else para que el resultado obtenido sea el mismo.
Citar
<?php

$haceFrio = 15;

$respuesta ="";

$temperatura = ($haceFrio<20) ? $respuesta = "Hace frio" : $respuesta = "No hace frio";

echo $respuesta;
?>
1.Se ejecuta el condional ternario. Ejecutando la primera sentencia que cumple la condición. Saliendo por pantalla "Hace frio"

2.
Código: [Seleccionar]
<?php

$haceFrio 
15;

$respuesta ="";

if (
$haceFrio 20){
    
    echo (
$respuesta "Hace frio");
    
}else{
    
    echo (
$respuesta "No hace frio");
    
}

?>

Ejercicio 2.
http://cursophp.byethost14.com/ejercicio2if.php

Código: [Seleccionar]
<?php 

$tipo 
"Rueda de camion";

$grosor 0.33;

$diametro 1.25;

$marca "Kimashuki";

if (
$diametro>1.4){
    
    echo (
"La rueda es para un vehiculo grande");

}else if (
$diametro<=1.4){

    echo (
'La rueda es para un vehiculo pequeño');
    
}else{
    
    echo (
"No existe un tamaño de rueda válido.");
}
?>

Saludos

26
Hola xicos,
es fácil usa las distintas características de background con CSS. Pero me surge un problema, defino un div en que es un cuadrado dentro de la página principal y este cuadrado no me deja definir background-attachment, bueno no me deja o hago algo incorrecto.
Adjunto algo parecido de código para que podais ver lo que quiero decir. Probar los distintos valores de background-attachment y vereis como no responde a lo que se le pide.
Código: [Seleccionar]
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
<style>
    #cuadro{
        border:solid thin black;
        display:block;
        position: absolute;
        width:400px;
        height:400px;
        top:20%;
        left:30%;
        overflow:scroll;
        background-image:url('http://lorempixel.com/200/200');
        background-attachment:local;
        background-repeat:no-repeat;
    }   
</style>
</head>
<body>
    <div id="cuadro">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad iste, nostrum corporis suscipit numquam perspiciatis explicabo nemo provident consequuntur, enim accusamus nobis perferendis. Cumque laboriosam incidunt tempora tenetur, atque laborum.</p>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sed repudiandae vero facilis sequi maxime, laudantium optio. Sint exercitationem quos ex in, quaerat laudantium, mollitia labore, nisi voluptatum, suscipit ducimus fuga.</p>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloribus delectus iusto, perferendis unde laboriosam, at tempora reprehenderit ullam tempore qui reiciendis hic excepturi, repellat placeat ea quos blanditiis! Pariatur, ipsa.</p>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad iste, nostrum corporis suscipit numquam perspiciatis explicabo nemo provident consequuntur, enim accusamus nobis perferendis. Cumque laboriosam incidunt tempora tenetur, atque laborum.</p>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sed repudiandae vero facilis sequi maxime, laudantium optio. Sint exercitationem quos ex in, quaerat laudantium, mollitia labore, nisi voluptatum, suscipit ducimus fuga.</p>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloribus delectus iusto, perferendis unde laboriosam, at tempora reprehenderit ullam tempore qui reiciendis hic excepturi, repellat placeat ea quos blanditiis! Pariatur, ipsa.</p>
    </div>
</body>
</html>
Saludos y gracias antemano.

27
Hola chicos, necesito una ayuda.

Tengo el siguiente código que hace que cuando el usuario quiera se muestre un texto o se oculte, pero también quiere que cambie la imagen, cuando no está el texto la imagen tiene unas flechas hacia abajo y cuando está el texto tiene unas flechas hacia arriba. Si que consigo que aparezca el texto cuando yo quiero pero quiero cambiar la imagen y no consigo ver cómo hacerlo.


Código: [Seleccionar]
<div class="pulsador">
    <p>Ejemplo <img class="flecha" src="...."></p>
</div>
<div class="texto">
    <p>Aquí pongo el texto</p>
</div>
<div class="pulsador">
    <p>Ejemplo <img class="flecha" src="...."></p>
</div>
<div class="texto">
    <p>Aquí pongo el texto</p>
</div>
<div class="pulsador">
    <p>Ejemplo <img class="flecha" src="...."></p>
</div>
<div class="texto">
    <p>Aquí pongo el texto</p>
</div>



Y el código Javascript que tengo

Código: [Seleccionar]
window.onload = function(){
    mostrar();
}

function mostrar(){
    var items, show , imagenes;
    show = false;
    items = document.querySelectorAll(".pulsador");
    imagenes = document.querySelectorAll(".flecha");
    for ( var i = 0 ; i < items.length ; i++){
        items[i].addEventListener("click",aparecer);
    }

    function aparecer(){
        if (show == false){
        this.nextElementSibling.style.display = "block";
        show = true;
        }else{
        this.nextElementSibling.style.display = "none";
       
        show = false;
        }
    }
}


28
Una vez llegado a este punto felicitar a todas las personas que hayan participado en la creación de este curso. Está muy muy bien, me he quedado con ganas de mucho más. Es un gran curso de Javascript desde cero.

Personalmente recomiendo a todas las personas que no hayan trabajado con Javascript que realicen este curso, tiene muchísimos ejemplos, ejercicios.

Además qué comentar de los foros, los ejercicios son corregidos y las dudas contestadas en muy poco tiempo.

Ahora, me planteo en si seguir con el curso de PHP y llegar a ver AJAX, que me gustaría aprender un poco de AJAX o bien comprar algún libro de Javascript potente que explique un poco de callbacks, promise ,etc y pasarme a la libreria jQuery, para poder llegar a Angular.

De todos modos haga una cosa u otra, nos mantendremos en contacto através del foro.

Muchas gracias y saludos!!!

29
Hola chicos, adjunto mi código. Aquí podreis ver mi localidad cómo es y dónde está.

Citar
Crea una página web donde se muestre información sobre tu ciudad conteniendo un mapa interactivo de Google Maps, de acuerdo con esta estructura para el documento HTML.
Código: [Seleccionar]
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
<link href='https://fonts.googleapis.com/css?family=Slabo+27px|Gloria+Hallelujah' rel='stylesheet' type='text/css'>
<style>
    body{
        font-family:sans-serif;
        margin: 10px 30px;
    }
   
    div{
        font-family: 'Slabo 27px', serif;
        text-align: justify;
        display: block;
       
    }
   
    div p::first-letter{
        font-size: 30px;
    }
   
    #nombre_ciudad{
        font-family: 'Gloria Hallelujah', cursive;
        font-size: 50px;
        font-weight: bold;
        color: burlywood;
        text-align: center;
    }
   
    #imagenes img{
        margin-left:40px;
    }

    #googleMap{
        position:relative;
        left:30%;
        width:500px;
        height:500px;
    }
   
</style>
<script src="http://maps.googleapis.com/maps/api/js"></script>

<script>
    function initialize() {
        var mapProp = {
  center:new google.maps.LatLng(39.4563421 , -0.4609107), // Introducimos coordenadas cartesianas
   zoom: 5,                                                 // Zoom del mapa
  mapTypeId: google.maps.MapTypeId.SATELLITE            // Tipo de mapa
};
        var map=new google.maps.Map(document.getElementById("googleMap"), mapProp); // incrustamos el mapa en nuestro elemento de HTML
       
        /* Colocamos una señal para saber dónde está la ubicación */
        var marker=new google.maps.Marker({
  position:mapProp.center,             // indicamos posicion de la maraca
  animation:google.maps.Animation.BOUNCE   // animamos marca
  });

marker.setMap(map);
       
   
}
    google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
   <div id="nombre_ciudad">Alacuás</div>
   <div>
       <p>Alacuás (en valenciano y oficialmente Alaquàs) es una ciudad y municipio español situado en la parte central de la comarca de la Huerta Oeste, en la provincia de Valencia, Comunidad Valenciana. Pertenece al Área metropolitana de Valencia. Contaba con 29.964 habitantes en 2014 .</p>
   </div>
   <div id="imagenes">
       <img id='primera' src='http://castell.alaquas.org/archivos_subidos/castillo.jpg' />
       <img id='segunda' src='https://upload.wikimedia.org/wikipedia/commons/thumb/1/1a/Coat_of_Arms_of_Alaqu%C3%A0s.svg/89px-Coat_of_Arms_of_Alaqu%C3%A0s.svg.png'/>

   </div>
   <div>
       <p>Aunque se han encontrado algunos restos romanos, así como monedas de época imperial y hasta alguna lápida conmemorativa, el núcleo de Alacuás es una alquería de origen musulmán.Jaime I la rindió en 1238 y la donó a Bernat de Castellnou el 4 de julio de ese año. Este cedió la alquería, a cambio de otras posesiones, a Ponç Soler, a quien posteriormente se le confiscó y revirtió a la Corona. En todo caso, en 1319 Joan Escrivà compró el señorío, que pasó después a los Vilaragut y, ya en el siglo XV, a los Agular.En 1520, por no haberse unido a la revuelta de las Germanías, se le concedió el título de villa.
       </p>
       <p>En 1557, Felipe II creó el condado de Alacuás, cuyo señorío ostentaba en 1584 Luis Pardo de la Casta. Es este personaje quien impulsó la construcción del castillo de Alacuás sobre la fortificación musulmana anterior.Más tarde, el condado perteneció a los marqueses de Manfredi y, después, al barón de Bolbaite.</p>
   </div>
   <div id="googleMap" ></div>
   <div>
       <p>En 1520 el núcleo contaba con unas 120 familias (aproximadamente unas 550 personas), que llegaron a las 200 (unos 900 hab.) en 1609.La expulsión de los moriscos en 1611 afectó considerablemente, de modo que en 1646, las familias que vivían en el pueblo eran 153 (689 hab.) y en 1713 sólo 143 (644 hab.).Con todo, la población se recuperó y se aproximaba a los 2000 en 1877. El siglo XX ha cambiado totalmente la fisonomía y la dinámica del lugar, siendo el crecimiento especialmente intenso en la segunda mitad del siglo XX.La función de ciudad dormitorio, primero, y de pueblo industrializado después (en 1970, un 72 % de los activos trabajaban en el sector secundario), explica que Alacuás fuera centro de inmigración a lo largo de aquellas décadas. De hecho, en 1975 un 76% de la población era alóctona.</p>
   </div>
   
</body>
</html>

Saludos!!!!

30
Hola chicos, adjunto mi solución a este ejercicio CU01195E del curso de programación básica con JavaScript.

Citar
Este ejercicio no forma parte del curso, por eso se califica como opcional. El ejercicio consiste en dibujar la bandera de tu país usando canvas y JavaScript. La respuesta al ejercicio debe ser el código que genere la bandera.
Código: [Seleccionar]
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
<style>
    #myCanvas{
        border:solid thin black;
    }   
</style>
<script>
window.onload = function(){
    var elemento = document.getElementById("myCanvas");
    /* primera franja de color roja */
    var bandera = elemento.getContext("2d");
    bandera.fillStyle = "#FF0000";
    bandera.fillRect(0,0,400,100);
   
    /* segunda franja de color amarillo */
    bandera.fillStyle = "#FFFF00";
    bandera.fillRect(0,100,400,100);
   
    /*tercera franja de color rojo */
    bandera.fillStyle = "#FF0000";
    bandera.fillRect(0,200,400,100);
}

</script>

</head>
<body>
    <canvas id="myCanvas" width="400" height="300">
</canvas>

</body>
</html>

Saludos!!!

31
Hola chicos, adjunto mi código para este ejercicio CU01194E del tutorial básico de desarrollo web JavaScript desde cero.

Por cierto, he usado la libreria chart que está hecha y mantenida por Google, más que nada por que todo lo que tiene Google está muy bien documentado y facilita mucho el uso de sus librerias.

Citar
Este ejercicio no forma parte del curso, por eso se califica como opcional. El ejercicio consiste en ver un breve ejemplo de uso de una librería JavaScript para creación de un gráfico.

Considera que como resultado de realizar una encuesta a los clientes de un hotel se han obtenido estos resultados: 35 % insatisfechos, 42 % satisfechos y 23 % indiferentes.

Se pide utilizar una librería o framework JavaScript especializada en la creación de gráficos para crear un gráfico circular que refleje dichos resultados.
Código: [Seleccionar]
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
      google.charts.load("current", {packages:["corechart"]});
      google.charts.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Task', 'Hours per Day'],
          ['Satisfecho',    42],
          ['Indiferente',      23],
          ['Insatisfecho',     35]
                 ]);

        var options = {
          title: 'Resultado ejercicio CU01194E',
          is3D: true,
        };

        var chart = new google.visualization.PieChart(document.getElementById('piechart_3d'));
        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="piechart_3d" style="width: 900px; height: 500px;"></div>
  </body>
</html>

Saludos!!!

32
Hola chicos, adjunto mi solución para este tema.

Citar
Un programador ha creado este código y nos han pedido que a) Lo comentemos de forma adecuada. b) Lo indentemos y organicemos de forma adecuada. Revísalo, coméntalo y organízalo conforme a los estándares que hemos explicado, incluyendo comentarios de cabecera de función y comentarios en línea para describir los aspectos más relevantes:
Código: [Seleccionar]
<!DOCTYPE html>

<html><head><title>Cursos aprende a programar</title><meta charset="utf-8">

<meta name="description" content="Aprende a programar con cursos reconocidos por su calidad didáctica: HTML, CSS, JavaScript, PHP, Java, Visual Basic, Joomla, pseudocodigo, diagramas de flujo, algoritmia y más.">

<meta name="keywords" content="HTML, CSS, JavaScript, Java, Visual Basic, Joomla, PHP, pseudocodigo, diagramas de flujo, cursos, tutoriales">

<style type="text/css"> *{font-family: verdana, sans-serif;} #principal{text-align:center;width:95%; margin: 0 auto;}

.tituloCurso {color: white; float:left; padding: 36px 44px; font-size: 2.65em; font-style:bold; text-decoration:none;}

a:hover{color:orange !important;}</style>

<script type="text/javascript">
 /**

 * @fileoverview código página inicial

 *

 * @version                               2.2

 *

 * @author              autor del código

 * @copyright           aprenderaprogramar.com

 *

 * History              aquí se pondría las distintas versiones

 * v2.2 –

 * v2.0 –

 * v1.1 –

 * ----

 *

        */

/**

 * En esta función definimos las variables que se van a usar, las inicializamos.
 
 * Hacemos la llamada a la función ejemploAcción tras 1500 ms, la cual es llamada con los argumentos
 
 * que hemos definido anteriormente

 */


function ejemplo(){

var nodosTituloCurso = document.querySelectorAll(".tituloCurso");

var contador = 0;

var nodosCambiados = new Array();

var tocaCambiar = true;

setTimeout(function() {ejemploAccion(nodosTituloCurso, nodosCambiados, contador, tocaCambiar)}, 1500);

}



/**

 * Función que encarga de la acción del script la cual de una forma alaeatoria seleccionala unos nodos

 * y les dará un determinado estilo.
 
 * @param  {NodeList} nodosTituloCurso
 
 * @param  {Array} nodosCambiados
 
 * @param  {Number} contador
   
 * @param  {Boolean} tocaCambiar

 */
   
function ejemploAccion(nodosTituloCurso, nodosCambiados, contador, tocaCambiar) {

                if (contador<nodosTituloCurso.length){

                var indice = Math.floor((Math.random() * (nodosTituloCurso.length)));  // calculo aleatorio

                if (nodosCambiados.length!=0) {

                               for (var i=0; i<nodosCambiados.length; i++) {

                                               if(nodosCambiados[i]==indice) {tocaCambiar = false;}

                               }

                }

                if (tocaCambiar==true) {

                cambiarNodo(nodosTituloCurso[indice]);

                nodosCambiados.push(indice);

                contador = contador+1;

                setTimeout(function() {ejemploAccion(nodosTituloCurso, nodosCambiados, contador, tocaCambiar)}, 1500);

                } else {tocaCambiar=true; ejemploAccion(nodosTituloCurso, nodosCambiados, contador, tocaCambiar);}

                }

                else { //Caso base fin de la recursión y se añade estilo

                               document.body.style.backgroundColor='black';

                               document.getElementById('principal').style.color='white';

                               for (var i=0; i<nodosTituloCurso.length; i++) {

                                               nodosTituloCurso[i].style.color='yellow';

                               }             

                }

}



/**

 * Cambiar el estilo backgroundColor de un nodo

 * @param  {domElement}

 */

function cambiarNodo(elNodo){elNodo.style.backgroundColor = 'black';}

</script>

</head>

<body onload="ejemplo()">

<div id="principal"><h1>Cursos de programación</h1>

<h3>Reconocidos por su calidad didáctica</h3>

<div ><a class="tituloCurso" href="http://aprenderaprogramar.com/index.php?option=com_content&view=category&id=28&Itemid=59"> Fundamentos</a></div>

<div ><a class="tituloCurso" href="http://aprenderaprogramar.com/index.php?option=com_content&view=category&id=68&Itemid=188"> Java</a></div>

<div ><a class="tituloCurso" href="http://aprenderaprogramar.com/index.php?option=com_content&view=category&id=69&Itemid=192"> HTML</a></div>

<div ><a class="tituloCurso" href="http://aprenderaprogramar.com/index.php?option=com_content&view=category&id=75&Itemid=203"> CSS</a></div>

<div ><a class="tituloCurso" href="http://aprenderaprogramar.com/index.php?option=com_content&view=category&id=78&Itemid=206"> JavaScript</a></div>

<div ><a class="tituloCurso" href="http://aprenderaprogramar.com/index.php?option=com_content&view=category&id=70&Itemid=193"> PHP</a></div>

<div ><a class="tituloCurso" href="http://aprenderaprogramar.com/index.php?option=com_content&view=category&id=38&Itemid=152"> Joomla</a></div>

<div ><a class="tituloCurso" href="http://aprenderaprogramar.com/index.php?option=com_content&view=category&id=37&Itemid=61"> Visual Basic</a></div>

<div ><a class="tituloCurso" href="http://aprenderaprogramar.com/index.php?option=com_content&view=category&id=28&Itemid=59"> Pseudocódigo</a></div>

<div ><a class="tituloCurso" href="http://aprenderaprogramar.com/index.php?option=com_content&view=section&layout=blog&id=7&Itemid=26"> Libros/ebooks</a></div>

<div ><a class="tituloCurso" href="http://aprenderaprogramar.com/index.php?option=com_content&view=article&id=64&Itemid=87">Cursos tutorizados</a></div>

</div>

</body>
</html>


Saludos!!

33
Ejercicio CU01191E del curso básico de desarrollo web con JavaScript desde cero.

Citar
a) Reescribe el código HTML que presenta distintas deficiencias y no se ajusta a las normas de estilo habituales.

b) Reescribe el código JavaScript para que cumpla con las normas de estilo que hemos estudiado.

c) Corrige el código del reloj para que se vea una mejor presentación y funcione correctamente.

d) Incluye comentarios en el código indicando qué es lo que hacen las diferentes partes del código JavaScript.

e) Como resultado de este ejercicio debes presentar el código con todos los cambios antes mencionados.

Código: [Seleccionar]
<!DOCTYPE html>
 <html>
 <head>
 <title>Hora y Fecha</title>
<style>
    #contenedor{
        background-image:url('http://lh5.ggpht.com/_PeVwghrmOec/TMkzEonRrcI/AAAAAAAAAHc/IxL8g0fTYtk/an_oliva_png.png');
        background-repeat: no-repeat;
        background-size:200px 200px;
        background-position: center;
        width:300px;
        height:200px;
        border:solid thin black;
        padding:10px;
        position: relative;
        box-shadow: 10px 10px 10px;
        top:150px;
        left:35%;
       
    } 
   
    #contenedor div{
        display: inline-block;
    }
   
    #clock{
        background-color: antiquewhite;
        border: solid thin coral ;
        position:absolute;
        width:90px;
       
        bottom :10px;
        left:10px;
        text-align: center;
        line-height: 30px;
       
       
    }
   
    #fecha{
        background-color: antiquewhite;
        border: solid thin coral ;
        position:absolute;
        width:90px;
       
        bottom:10px;
        left:215px;
        text-align: center;
        line-height: 30px;
    }
   
   
    #enlace{
        position: absolute;
        bottom: 60px;
        left:40px;
        height:30px;
        width:230px;
        border:solid thin black;
        border-radius:25px;
        background-color:gainsboro;
        text-align: center;
        font-size:20px;
    }
</style>
 <script language="JavaScript">
// Se carga la ejecución cuando se haya cargado todos los elementos de la pagina html
window.onload = function() {
   
    // LLamada a la función para la fecha
   
    getthedate()

    // Llamada a la funcion para la hora
    showtime();
   
}


// funcion para recuperar la fecha actual y mostrarlo en el codigo html en la etiqueta con id = 'fecha'
function getthedate() {
   
    var today = new Date();
   
    var fecha = document.getElementById('fecha');
   
    theDate = "" + (today.getMonth()+ 1) +" / "+ today.getDate() + " / ";
   
    theDate += today.getFullYear();

    fecha.innerHTML = theDate;

}


 
// funcion para recuperar la hora actual y mostrarlo en el código html en la etiqueta con id='clock'
function showtime () {

    var now = new Date();
   
    var hours = now.getHours();
   
    var minutes = now.getMinutes();

    var seconds = now.getSeconds();
   
    var reloj = document.getElementById('clock');

    var timeValue = "" + ((hours >12) ? hours -12 :hours);

    timeValue += ((minutes < 10) ? ":0" : ":") + minutes;

    timeValue += ((seconds < 10) ? ":0" : ":") + seconds;

    timeValue += (hours >= 12) ? " P.M." : " A.M.";

    reloj.innerHTML = timeValue;

    var timerID = setTimeout("showtime()",1000);

}

</script>

</head>

<body>

<div id='contenedor'>
    <h2>Esto es un reloj hecho con JavaScript</h2>
        <div id = 'clock'></div>
        <div id = 'fecha'></div>
        <div id = 'enlace'>
           
                <a href="http://aprenderaprogramar.com">aprenderaprogramar.com</a>
           
        </div>
</div>

</body>
</html>

Saludos!!!!

34
Hola chicos, paso a poner mis soluciones a este tema (CU01190E del curso de programador web JavaScript básico).

Sobre hoisting, decir que , como norma deberiamos declarar siempre todas las variables que vamos a utilizar en una función al principio de este. Y decir, que aunque no sabía que se llama hoisting, esto lo hacemos todos sin darno cuenta, por ejemplo cuando declaramos una sentencia for y creamos una variable como contador.

Código: [Seleccionar]
<!DOCTYPE html>

<html><head><title>Ejemplo aprenderaprogramar.com</title><meta charset="utf-8">

<script type="text/javascript">

var x = 'Hola amigos'; // variable global

function ejemplo(){
 alert( x ); // esperamos el valor global
 var x;
 x = 'Saludos desde Costa Rica'; // redefinimos la variable en contexto local
 alert( x );  // esperamos el nuevo valor local
}

</script></head>

<body><div id="cabecera"><h2>Cursos aprenderaprogramar.com</h2><h3>Ejemplos JavaScript</h3></div>
<div style="color:blue;" id ="pulsador" onclick="ejemplo()"> Probar </div>
</body></html>


Citar
a) Realiza una prueba pulsando en “Probar”. ¿Qué resultados obtienes? ¿Cómo se explican esos resultados?

Nos aparece dos alert:

1.En el primero, sale undefined

2.En el segundo, 'Saludos desde Costa Rica'

En el primero sale undefined porque se ha hecho hoisted ('Cuando se declara una variable en un punto intermedio del código, dicha declaración es “elevada” (hoisted) a la parte inicial del código en el ámbito donde se encuentra dicha variable'), esto es , se ha redefinido la variable x y no se le dado ningún valor, se ha elevado a la parte inicial de nuestra función, pero no se le ha asignado ningún valor, por eso , nos sale undefined.


Citar
b) Cambia el código y declara la variable x dentro de la función al mismo tiempo que la inicializas. ¿Qué resultados obtienes? ¿Cómo se explican esos resultados?

Al asignar un valor a la variable x, obtenemos el mismo resultado que el anterior 'undefined' porque esta definición está situada después del 'alert(x)'.


Citar
c) De los dos casos anteriores ( a y b ). ¿En cuáles se produce hoisting: en el a), en el b) ó en ambos?

Se produce hoisting en los dos casos.


Citar
d) En este caso, ¿el hoisting está afectando a los resultados obtenidos? ¿Por qué? ¿Cuáles serían los resultados de ejecutar estos códigos si no existiera hoisting?

Si. Como hemos dicho anteriormente existe hoisting y se eleva la declaración de la variable a la parte inicial del código en el ámbito de la función. Si no se produjera hoisting nada más ejecutar la función su resultado sería mostrar un alert con 'Hola amigos'.

Saludos!!!!

35
Hola chicos, pongo mis soluciones al tema CU01189E del tutorial del programador web: JavaScript desde cero.

Ejercicio 1

Código: [Seleccionar]
var persona1 = {};

Object.defineProperty(persona1, "edad", { value: 42, writable: false });

persona1.edad = 19;
Citar
a) Explica paso a paso el significado de este código (busca información en internet si te es preciso).
Se crea un objeto con nombre persona1.
Se define una propiedad del objeto persona1 que es edad y se le atorga el valor de 42.
Se define de nuevo la propiedad edad y ahora su valor es 19.

Citar
b) Crea un pequeño script donde se ejecute este código y se muestre un mensaje por pantalla informando del valor de la edad. Activa la consola para comprobar si aparece algún error.

No aparece ningún error

Código: [Seleccionar]
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>

var persona1 = {};
Object.defineProperty(persona1, "edad", { value: 42, writable: false });
persona1.edad = 19;
console.log(persona1.edad);
alert(persona1.edad);
</script>
</head>
<body>
</body>
</html>


Citar
c) Crea el mismo script pero usando strict mode. Activa la consola y comprueba si aparece algún error. ¿Qué diferencias observas entre la ejecución con strict mode y sin strict mode? ¿Qué explicación le darías a estas diferencias? ¿Crees que sería positivo que este código se escribiera en strict mode o no? ¿Por qué?
El error que sale por consola es:
 'TypeError: "edad" is read-only'
 La diferencia entre usar 'use strict' a no usarla es que que al usar esta sentencia tenemos que usar las tecnicas para escribir Javascript al pie de la letra, escribir código de una forma más estricta y cumpliendo la buenas prácticas de escribir código. En este caso estamos cambiando la propiedad de un objeto dos veces cuando al haberlo definido le hemos indicado writeble:false, por lo que es una propiedad de lectura y lo estamos sobreescribiendo.
 En este código sería bueno usar esta forma de escribir en buenas prácticas Javascrip por lo menos hasta que tuvieramos superado escribir en Javascript sería buena idea escribir código 'use strict', ya que es la manera que escribir código y la consola te avise de que no estas usando 100% de una forma correcta el código.
Código: [Seleccionar]
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
<script>
'use strict'; 
   
 var persona1 = {};

Object.defineProperty(persona1, "edad", { value: 42, writable: false });

persona1.edad = 19;
   
console.log(persona1.edad);
   
alert(persona1.edad);
</script>
</head>
<body>
   
</body>
</html>

Ejercicio 2
Citar
Crea y ejecuta un script que use with y que esté:

a) En modo normal. ¿Cuál es el código y cuál es el resultado que obtienes?
Código: [Seleccionar]
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
<script>
function decorar(){
 with(document.getElementById('boton').style) {
     
     backgroundColor = 'gainsboro';

    color = 'black';

    width = '200px';

    padding = '20px';

    fontSize = '32px';
     
    textAlign = 'center';
   
    borderRadius = '25px';
     
    border = 'solid thin black';
     
    cursor = 'pointer';
   

}
}

Citar
b) En strict mode. ¿Cuál es el código y cuál es el resultado que obtienes?
Al ejecutar el código con 'use strict' nos dá error. Como se dice en el tema sucede el error porque :
'En JavaScript el uso de with se considera una mala práctica. Los motivos para ello son que puede dar lugar a comportamientos inesperados, problemas de rendimiento y problemas de seguridad.'

36
Hola chicos, os paso mis soluciones a este tema CU01188E del tutorial básico de desarrollo web con JavaScript:

Citar
a) ¿Para qué sirve la función createCookie? Explica paso a paso qué es lo que hace esta función.

Esta función como dice el nombre lo que hace es crear una cookie, recibe tres argumentos que son nombre,valor y dias.

Interiormente en la función, hay una condición que si hemos introducido un valor correcto de dias, se crea la varable expires que será la que marque la fecha de eliminación de la cookie, sumando dias a la fecha actual.

Si no se introduce correctamente los dias, se elimina.


Citar
b) ¿Para qué sirve la función eraseCookie? Explica paso a paso qué es lo que hace esta función.

eraseCookie hace una referencia a la función createCookie con unos valores de llamada que hace que la cookie se elimine, ya que la variable dias es -1 lo que significa el tiempo de eliminación de la cookie ya ha pasado y se elimina.


Citar
c) Escribe el código de una función de nombre mostrarTodasLasCookies() que muestre el nombre y valor de todas las cookies existentes. Por ejemplo, si hay dos cookies deberá mostrarse algo como esto:

Hay 2 cookies en el documento

Cookie 1 con nombre: cookieNombreUsuario y valor: Alberto

Cookie 2 con nombre cookieEdadUsuario y valor 8


Código: [Seleccionar]
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
<script>
window.onload= function (){
   
    var start = document.getElementById('empezar').addEventListener('click',crear2Cookies);
   
}

function crear2Cookies(){
    eliminarCookies();
    createCookie('cookieNombreUsuario','Alberto',1);
    createCookie('cookieEdadUsuario',8,1);
    mostrarTodasLasCookies();
}

 function eliminarCookies(){
     var numeroCookies = document.cookie.split(';');
     for(var i=0;i < numeroCookies.length;i++) {
          eraseCookie(numeroCookies[i]);
     }
     
 }
   
 function createCookie(name,value,days) {

                if (days) {

                               var date = new Date();

                               date.setTime(date.getTime()+(days*24*60*60*1000));

                               var expires = "; expires="+date.toGMTString();

                }

                else var expires = "";

                document.cookie = name+"="+value+expires+"; path=/";

}

 function mostrarTodasLasCookies() {
     
                var numeroCookies = document.cookie.split(';');
     
                var msg = 'Hay '+numeroCookies.length+ ' cookies en el documento.\n';
     
                for(var i=0;i < numeroCookies.length;i++) { //Recorremos todas las cookies
                   
                    msg += 'cookie nº' +(i+1) + 'con nombre:' + numeroCookies[i].split('=',1)+ ' y valor:';
                   
                    var nombre =numeroCookies[i].split('=',1) + '=';
                   
var valor = numeroCookies[i];
                   
msg += valor.substring(nombre.length,valor.length) + '\n';
                   
                }
     
        alert (msg);   
     
}

function eraseCookie(name) { createCookie(name,"",-1); }
   
</script>
</head>
<body>
<button id="empezar">Crear 2 cookies</button>
</body>
</html>


Citar
d) Usando las funciones createCookie, eraseCookie y  mostrarTodasLasCookies() crea un script que pida 3 nombres y valores de cookies al usuario, y cree las cookies correspondientes. A continuación deberá mostrar las cookies existentes y sus valores. Finalmente, deberá borrar la última cookie existente y volver a mostrar todas las cookies y sus valores.


Código: [Seleccionar]
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
<script>
window.onload= function (){
   
    var start = document.getElementById('empezar').addEventListener('click',crear3Cookies);
   
}
function crear3Cookies(){
   
    var nombre = [];
   
    var valor = [];
   
    for (var i = 0;i<3;i++){
       
        nombre[i] = prompt ('Introduzca el nombre de la cookie nº'+(i+1)+':');
       
        valor[i] = prompt ('Introduzca el valor de la cookie nº'+(i+1)+':');
       
        createCookie(nombre[i],valor[i],5); // los cookies que creamos desaparecen dentro de 5 dias
       
    }
    mostrarTodasLasCookies();
   
    alert ('Ahora vamos a eliminar la última cookie');
   
    var Cookies = document.cookie.split(';');
   
    eraseCookie(Cookies[Cookies.length-1].split('=', 1));
   
    mostrarTodasLasCookies();
   
}


 function createCookie(name,value,days) {

                if (days) {

                               var date = new Date();

                               date.setTime(date.getTime()+(days*24*60*60*1000));

                               var expires = "; expires="+date.toGMTString();

                }

                else var expires = "";

                document.cookie = name+"="+value+expires+"; path=/";

}

 function mostrarTodasLasCookies() {
     
                var numeroCookies = document.cookie.split(';');
     
                var msg = 'Hay '+numeroCookies.length+ ' cookies en el documento.\n';
     
                for(var i=0;i < numeroCookies.length;i++) { //Recorremos todas las cookies
                   
                    msg += 'cookie nº' +(i+1) + 'con nombre:' + numeroCookies[i].split('=',1)+ ' y valor:';
                   
                    var nombre =numeroCookies[i].split('=',1) + '=';
                   
var valor = numeroCookies[i];
                   
msg += valor.substring(nombre.length,valor.length) + '\n';
                   
                }
     
        alert (msg);   
     
}

function eraseCookie(name) { createCookie(name,"",-1); }
   
</script>
</head>
<body>
<button id="empezar">Crear tres cookies</button>
</body>
</html>

Saludos!!!!

37
Hola chicos!!!

Mis soluciones para este tema CU01187E del curso básico de programación web con JavaScript son:

Código: [Seleccionar]
<html> <head><meta charset="utf-8"><style type="text/css"> input {margin:10px;} </style>

<script>

function validarPassword(password){

  try  {

    if(password.length < 5 ) {      throw "SHORT";    }else if(password.length > 10 ) {  throw "LONG";    }

    alert("Password Validated!");

  } catch(e) {

    if(e == "SHORT"){  alert("Not enough characters in password!"); }

    else if(e == "LONG"){ alert("Password contains too many characters!");   }

  }finally{    document.miFormulario.password.value="";   }

  alert("La revisión ha terminado.");

}

 </script>
    </head>

    <body>
        <form name="miFormulario" onsubmit="validarPassword(document.getElementById('pass').value)" action="#" >
            Nombre de usuario: <input type="text" name="campo1"><br>
            Password: <input id="pass" type="password" name="password"><br>
            <input type="submit" value="Comprobar" name="comprobar">
        </form>
    </body>
</html>


Citar
a) Busca información en internet y respode: ¿Qué significado tiene una instrucción como throw "SHORT";? ¿A qué da lugar? ¿Qué diferencia hay entre throw "SHORT" y throw new Error('SHORT')?

La instrucción throw "SHORT" , lanza la cadena que se encuentra entre comillas como mensaje de error dentro de una sentecia try {} catch(mensaje_error){}.
La diferencia entre las dos formas de lanzar un mensaje es que en throw "SHORT" se lanza el mensaje y en throw new Error('SHORT') , se crea un objeto de tipo Error cuyo mensaje de error es "SHORT". El objeto Error, se forma de la siguiente forma:

Código: [Seleccionar]
new Error (opcional_message, opcional_fileName, opcional_lineNumber);

Citar
b) ¿Cuál es el objetivo que parecía pretender cumplir el autor del código?

El objetivo del autor del código pretende validar el campo de password para que cumpla ciertos requisitos.


Citar
c) ¿En qué casos se ejecuta la cláusula finally incluida en el código?

La cláusula finally por definición se ejecuta independientemente de que se haya producido un error o no durante la ejecución del bloque try. El objetivo habitual de una cláusula finally es liberar un recurso que haya podido ser comprometido anteriormente.

Saludos!!

38
Hola chicos, os adjunto mis soluciones para este tema, ejercicio CU01186E del tutorial de programación web desde cero con JavaScript.

Código: [Seleccionar]
<html><head><script type="text/javascript">

image01= new Image()

image01.src="http://i877.photobucket.com/albums/ab336/cesarkrall/Divulgacion/logonotplusplus.png"

image02= new Image()

image02.src="http://i877.photobucket.com/albums/ab336/cesarkrall/Divulgacion/DV00405A_1.jpg"

function rollover(imagename, newsrc){

document.images[imagename].src=newsrc.src

}

</script></head>

<body style="text-align:center; margin:50px;">

<p> Pasa el mouse sobre la imagen </p>

<a  href="#" onmouseover="rollover('example', image02)"

onmouseout="rollover('example', image01)">

<img src="http://i877.photobucket.com/albums/ab336/cesarkrall/Divulgacion/logonotplusplus.png" name="example">

</a>

</body></html>

Citar
a) ¿En qué ámbito se encuentran image01 e image02?
image01 e image02 se encuentran en ámbito global, en cualquier lugar se pondrán utilizar.

Citar
b) ¿Qué tipo de objetos son image01 e image02?
son objetos de tipo Image.

Citar
c) ¿Aparecerán errores debido a la falta de puntos y coma de terminación en las instrucciones de JavaScript? ¿Por qué?
en javascript no hace falta que la sentencia termine con un ; , pero se usa porque es un uso standar en programación.

Citar
d) Al acceder a una imagen con la sintaxis document.images[imagename], ¿se está usando un índice numérico para acceder a la colección? Si es numérico, indicar qué valores son los que se usan. Si no es numérico, indicar qué tipo de índice es.
No, en realidad estamos accediendo desde el atributo  name de la imagen.

Citar
e) El efecto esperado es que la imagen que se muestra cambie cuando pasamos el puntero del ratón por encima de ella. ¿Por qué se produce ese cambio? Explícalo brevemente.
Se produce el cambio porque cuando se produce el evento onmouseover, indicamos que se ejecute la función rollover con la imagen2 y si se produce el evento onmouseout, indicamos que se ejecute la función rollover con la imagen1.

Saludos!!!

39
Adjunto mis soluciones a este tema, CU01185E del tutorial del programador web con JavaScript desde cero.

Citar
a) ¿Cómo se realiza la comprobación de que no hay campos vacíos?
La manera de comprobar que los campos no estén vacios es comprobar con condicionales que el length de los value de todos los campos del formulario no sea cero.
Código: [Seleccionar]
if ((formulario.campo1.value.length == 0) || (formulario.campo2.value.length ==0) || (formulario.cpostal.value.length ==0) || (formulario.dni.value.length ==0) || (formulario.email.value.length ==0)) {

                    alert('Falta información');

                    return false;

                } 

Citar
b) ¿Cómo se realiza la comprobación de que el campo 2 es un número?
Se realiza através de la condicion isNan.Se pasa a entero primero el valor que esté introducido en el campo 2 y posterioemente comprobamos que si no es número salga el alert y retorne false.
 
Código: [Seleccionar]
if (isNaN(parseInt(formulario.campo2.value))) {

                    alert('El campo2 debe ser un número');

                    return false;

                }

Citar
c) ¿En qué consiste la validación del código postal? Explícala paso a paso. Pon ejemplos de tres valores válidos y tres valores no válidos.
El campo de codigo postal está validado con una expresion regular.  si no cumple la expresion retornará un false.
Código: [Seleccionar]
var ercp=/(^([0-9]{5,5})|^)$/;

                if (!(ercp.test(formulario.cpostal.value))) {

                    alert('Contenido del código postal no es un código postal válido');

                    return false; }
/(^ empezamos expresion regular
[0-9] valor numerico entre 0 y 9
{5,5} un valor numerico repetido 5 veces
$/ terminamos expresione regular   
Ahora comprobamos con test la expresion regular. Si no cumple la condicion sale un mensaje de alert y retorna false, de lo contrario es true, Si cumple no hace nada pasa a la siguiente sentencia de codigo.
tres valores validos : 12345, 09890,00000
tres valores no validos: pppp4,23,qqqqq

Citar
d) ¿En qué consiste la validación del DNI? Explícala paso a paso. Pon ejemplos de tres valores válidos y tres valores no válidos.
El campo del dni consiste su validacion de una expresion regular la cual si no cumple la expresion regular devuelve un false y un alert con un mensaje.Si cumple no hace nada pasa a la siguiente sentencia de codigo
Código: [Seleccionar]
var erdni=/(^([0-9]{8,8}\-[A-Z])|^)$/;
                    if (!(erdni.test(formulario.dni.value))) {

                    alert('Contenido del dni no es un DNI válido.');

                    return false;  }
(^ empezamos expresion regular
[0-9] esta formado por numeros con un rango de 0 a 9
{8,8} está formado por 8 numeros
\- seguido por un guion
[A-Z] y le sigue por una letra ent mayusculas que se encuentra en el rango de la A a la Z
$/ se termina la expresion regular
tres valores validos:52525252-M,00000000-R,12345678-Y
tres valores no validos:532145-M, 23423423R,12312323-r

Citar
e) ¿En qué consiste la validación del email? Explícala paso a paso. Pon ejemplos de tres valores válidos y tres valores no válidos.
El campo de email consiste su validacion en una expresion regular , si no cumple la expresion sale un mensaje de alert y retorna false.
Código: [Seleccionar]
var ercorreo=/^[^@\s]+@[^@\.\s]+(\.[^@\.\s]+)+$/;       

                if (!(ercorreo.test(formulario.email.value))) {

                    alert('Contenido del email no es un correo electrónico válido.');

                    return false; }
/^ : empezamos expresion regular
[^@\s] : un conjunto de caracteres que no empiece por @ o caracter vacio
+@ : seguido del simbolo @
[^@\.\s]: conjunto de caracteres que no empiece por @,punto o caracter vacio
+(\. : caracter .
[^@\.\s]+) : conjunto de caracteres que no empiece por @,punto o caracter vacio; compuesta por uno o mas caracteres(+)
+$/ : cerramos expresion regular
tres valores válidos: asdasd@pepe.com, 23432@99.pi,epr23@pepe.paol
tres valores no válidos: @@.com, @.  o p, pop.op.es

Citar
f) ¿Cómo se consigue que no se envíe el formulario si no se cumplen los requisitos exigidos?
No se envía el formulario porque si no cumple al menos una de las expresiones regulares se devuelve el valor de false a la llamada de la funcion que está declarada en la etiqueta form en el evento onsubmit. Y este a la vez devuelve el valor booleano que se le mando, como es false no se ejecuta.
 

Saludos!!!

40
Hola chicos adjunto mis soluciones a este tema (CU01184E del tutorial básico de programación web: JavaScript desde cero)

Código: [Seleccionar]
<!DOCTYPE html>

<html><head><title>Ejemplo aprenderaprogramar.com</title><meta charset="utf-8">

</head>

<body><h2>Cursos aprenderaprogramar.com</h2><h3>Ejemplos JavaScript</h3>

<a href="javascript:void(0);" onclick="if (confirm('Are you sure?')) { var f = document.createElement('form');

 f.style.display = 'none'; this.parentNode.appendChild(f); f.method = 'POST'; f.action = this.href;var m = document.createElement('input');

 m.setAttribute('type', 'hidden'); m.setAttribute('name', '_method'); m.setAttribute('value', 'delete'); f.appendChild(m);

 var s = document.createElement('input'); s.setAttribute('type', 'hidden'); s.setAttribute('name', 'authenticity_token');

 s.setAttribute('value', 'aprenderaprogramar.com='); f.appendChild(s);f.submit(); };return false;">Pulsa aquí para proceder</a>
</body></html>
Citar
a) ¿Para qué se utiliza aquí javascript: void(0)?


Aquí se utiliza para que la etiqueta a de HTML que enlaza a otra página web (en general) al recibir el evento click no se redireccione a ningún sitio y se ejecute el javascript que tenemos dentro de onclick.


Citar
b) Explica paso a paso qué es lo que hace el código JavaScript que se ha incluido como respuesta al evento click.

Inicialmente se espera una respuesa Aceptar/Cancelar a la pregunta 'Are you sure?'
Si pulsamos cancelar devuelve false  no haria nada, al devolver false el evento anula la accion de href,aunque en este caso con la sentencia que tiene no se redireccionaba a ningun sitio.

 var f = document.createElement('form');  crea la etiqueta de formulario

  f.style.display = 'none'; // se le da el estilo de la etiqueta del form display:none, por lo que no se mostrará

  this.parentNode.appendChild(f); //se añade el elemento form al codigo html a parentNode que era body

  f.method = 'POST'; // se añade atributos a la etiqueta form, en este caso method='POST'

  f.action = this.href; // se añade atributos a la etiqueta form, en este caso action='javascript:void(0)'(el mismo href de este elemento)

  var m = document.createElement('input'); //creamos un elemento input
 m.setAttribute('type', 'hidden');// definimos atributos del nuevo elemento y le indicamos que es invisible type=hydden

  m.setAttribute('name', '_method');  // definimos atributo name='_method'

  m.setAttribute('value', 'delete'); // denimos atributo value='delete'

  f.appendChild(m); // añadimos el elemento input y lo insertamos como hujo de f

  var s = document.createElement('input'); //creamos un elemento input

  s.setAttribute('type', 'hidden'); // definimos atributos del nuevo elemento y le indicamos que es invisible type=hydden

  s.setAttribute('name', 'authenticity_token'); // definimos name='authenticity_token'

 s.setAttribute('value', 'aprenderaprogramar.com='); // definimos el atributo value=''aprenderaprogramar.com='

  f.appendChild(s);// lo añadimos como hijo del form

  f.submit(); //enviamos el formulario

  };


Citar
c) ¿Qué implica el uso de return false; en este código?

el return false; es para que no se ejecute el href='' que tiene definido


Citar
d) Modifica el código para que la apariencia y resultados sean iguales pero sin usar un elemento <a> … </a>


Código: [Seleccionar]
<!DOCTYPE html>

<html><head><title>Ejemplo aprenderaprogramar.com</title><meta charset="utf-8">
<style>
    p.url{
        cursor:pointer;
        color:blue;
        text-decoration:underline;
}
    </style>
<script>
    window.onload = function(){
        var formulario = document.getElementById('enlace').addEventListener('click',anyadir);
    }
   
    function anyadir(){
        if (confirm('Are you sure?')) {
            var f = document.createElement('form');
            f.style.display = 'none';
            this.parentNode.appendChild(f);
            f.method = 'POST';
            f.action = '';
            var m = document.createElement('input');

            m.setAttribute('type', 'hidden');
            m.setAttribute('name', '_method');
            m.setAttribute('value', 'delete');
            f.appendChild(m);

            var s = document.createElement('input');
            s.setAttribute('type', 'hidden');
            s.setAttribute('name', 'authenticity_token');
            s.setAttribute('value', 'aprenderaprogramar.com=');
            f.appendChild(s);f.submit(); };
       
        return false;
    }
</script>
</head>

<body><h2>Cursos aprenderaprogramar.com</h2><h3>Ejemplos JavaScript</h3>

<p class='url' id='enlace'  >Pulsa aquí para proceder</p>
</body></html>

Saludos!!

Páginas: 1 [2] 3 4 5

Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.

Abraham Lincoln (1808-1865) Presidente estadounidense.

aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".