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 - juandeto

Páginas: [1]

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / JavaScript validación formulario con expresiones regulares no funciona CU01155E

« en: 11 de Abril 2020, 23:56 »

Hola, hice el ejercicio CU01155E del Curso Básico de JavaScript de aprenderaprogramar, y al parecer está todo bien, salvo que cuando se envía el formulario, que no se envían los valores modificados sino los ingresados en principio y no entiendo cuál es el error.

Saludos desde Argentina

EJERCICIO 1155. CONSIGNAS:

Citar

Crea un documento HTML (página web) donde exista un formulario que se envíe por el método GET. Se pedirá al usuario que introduzca nombre, apellidos y correo electrónico. Define dentro de la etiqueta form que cuando se produzca el evento onsubmit (pulsación del botón de envío del formulario) se ejecute una función a la que denominaremos validacionConExpReg que no recibe parámetros.

La función validar debe realizar estas tareas y comprobaciones utilizando expresiones regulares:

a) Comprobar que el nombre contiene al menos tres letras. Si no es así, debe aparecer un mensaje por pantalla indicando que el texto no cumple tener al menos tres letras. Por ejemplo si se trata de enviar Ka como nombre debe aparecer el mensaje: “El nombre no cumple tener al menos tres letras”.

b) Comprobar que el correo electrónico contiene el carácter @ (arroba) y el carácter . (punto). De no ser así, deberá aparecer un mensaje indicando que al correo electrónico le falta uno o ambos caracteres. Por ejemplo si se trata de enviar pacogmail.com deberá aparecer el mensaje: “Falta el símbolo @ en el correo electrónico”.

c) Antes de enviarse los datos del formulario a la página de destino, todas las letras del correo electrónico deben transformarse a minúsculas. Por ejemplo si se ha escrito PACO@GMAIL.COM debe enviarse paco@gmail.com
d) Antes de enviarse los datos del formulario a la página de destino, si el correo electrónico contiene la subcadena “ at “ debe reemplazarse por el símbolo @. Por ejemplo si se ha escrito paco at gmail.com debe enviarse paco@gmail.com

SOLUCIÓN

Código: [Seleccionar]


<!DOCTYPE html>

<html>

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

    <style type="text/css">
        body {
            font-family: 'Courier New', Courier, monospace;
        }

        .form1 {
            background-color: salmon;
            width: 50%;
            height: auto;
        }

        label {
            display: block;
            font-size: large;
            padding: 10px;
            margin: 10px;
        }

        .enviar {
            margin: 10px;
            padding: 5px;
        }

        .cancelar {
            margin: 10px;
            padding: 5px;
        }
    </style>

    <script type="text/javascript">

        function chequearForm() {
            var textoIngresado = document.getElementsByTagName('input');
            var valorNombre = textoIngresado[0].value;
            var valorEmail = textoIngresado[2].value;
            comprobarNOmbre(valorNombre);
            valorEmail = pasarAMinusculas(valorEmail);
            valorEmail = cambiarAt(valorEmail);
            comprobarMail(valorEmail);
            alert('valor email: ' + valorEmail);
        }

        function comprobarNOmbre(nombre) {
            var nombreMinimo = /\w{3}/;
            var chequeoNombre = nombreMinimo.test(nombre);
            if (chequeoNombre == false) {
                alert('Escribe un nombre con al menos tres letras');
            }
        }

        function pasarAMinusculas(nodoemail) {
            return nodoemail.toLowerCase();
        }

        function cambiarAt(nodoemail) {
            return nodoemail.replace(/\s\at\s/g, '@');
        }

        function comprobarMail(nodoemail) {
            var caracteresMail = /[\w]+\@{1}[\w]+\./;
            var chequeoMail = caracteresMail.test(nodoemail);
            if (chequeoMail == false) { alert('Por favor, chequee si ingreso los caracteres @ o punto'); }
        }


    </script>

</head>

<body>
    <div id="cabecera">
        <h2>Cursos aprenderaprogramar.com</h2>
        <h3>Ejemplos JavaScript</h3>
    </div>


    <form class="form1" action="https://aprenderaprogramar.com/" name="FormularioDeContacto" class="form1" method="get"
        onsubmit="chequearForm()">
        <label for="nombre"><span>Nombre </span><input id="nombre" type="text" name="nombre" value=""></label>
        <label for="apellido"><span>Apellido </span><input id="apellidos" type="text" name="apellidos" value=""></label>
        <label for="email"><span>Correo Electrónico </span><input id="email" type="text" name="email" value=""></label>
        <input type="submit" class="enviar" value="Enviar">
        <input type="reset" class="cancelar" value="Cancelar">
    </form>
</body>

</html>

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / Ejercicios resueltos RegEx expresiones regulares patrones JavaScript CU01154E

« en: 10 de Abril 2020, 17:55 »

Solución propuesta para el ejercicio del tutorial de programación web con ejercicios resueltos de JavaScript Expresiones regulares JavaScript. RegEx. new. Caracter especial. Número, letra, espacio blanco,?,* (CU01154E)

CONSIGNAS:

Citar

Dada la expresión regular de JavaScript /^[A-C]\w+\ses\s\w+/ indicar cuáles de las siguientes cadenas hacen match con la expresión regular, y en caso de hacer match, qué parte o partes son las que hacen match:

a) Juan es guapo

b) Adriano no es feo

c) Adriano deja de ser guapo

d) Adriano ya es guapo

e) No es ahora

f) Ahora es no

g) Adriano es guapo

RESOLUCIÓN:

Código: [Seleccionar]

<!DOCTYPE html>
<html>
<head>
    <title>Ejemplo aprenderaprogramar.com</title>
    <meta charset="utf-8">
    <script type="text/javascript">
        function expresionesRegulares() {
            var miExpReg = /^[A-C]\w+\ses\s\w+/;
            var msg = '';
            var frasesTrue = ''
            var arrayDeFrases = ['Juan es guapo', 'Adriano no es feo', 'Adriano deja de ser guapo', 'Adriano ya es guapo', 'No es ahora', 'Ahora es no', 'Adriano es guapo']
            for (i = 0; i < arrayDeFrases.length; i++) {
                msg = msg + 'la expresion "' + arrayDeFrases[i] + '" es: ' + miExpReg.test(arrayDeFrases[i]) + '\n\n';
                if (miExpReg.test(arrayDeFrases[i]) == true) {frasesTrue =frasesTrue+'"'+ arrayDeFrases[i]+ '", ' ; }
            }
            alert(msg);
            alert('las expresiones  ' + frasesTrue + ' son true porque cumplen con lo solicitado en la variable miExpReg, que es:\n\n una cadena que empiece con A, B o C, que siga con cualquier caracter válido, un espacio, la subcadena "es", otro espacio , seguido de cualquier caracter válido');
        }
    </script>
</head>
<body>
    <div id="cabecera">
        <h2>Cursos aprenderaprogramar.com</h2>
        <h3>Ejemplos JavaScript</h3>
    </div>
    <div style="color:blue;" id="pulsador" onclick="expresionesRegulares()"> Probar </div>
</body>
</html>

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / JasvaScript ejercicios resueltos Constructores herencia uso prototype CU01150E

« en: 07 de Abril 2020, 19:55 »

Les traigo mi solucion a los ejercicios de la leccion CU01150E del certificado formativo JavaScript de aprenderaprogramar.

Consignas:

Citar

EJERCICIO 1

Crea un esquema de herencia que cumpla con estos requisitos:

a) Un Médico especialista tiene una especialidad y es un tipo de Médico.

b) Un Médico trabaja en un centro de trabajo y es un tipo de Persona.

c) Una Persona tiene un nombre y una nacionalidad. Como método común a todas las personas tenemos mostrarNacionalidad, que muestra un mensaje informando de la nacionalidad.

Se desea crear un objeto de tipo MedicoEspecialista pasándole como parámetros para su creación además de sus propiedades intrínsecas las propiedades que hereda de sus supertipos y sobre este objeto invocar el método mostrarNacionalidad(), que deberá ser reconocido por herencia.

Para comprobar si tus respuestas y código son correctos puedes consultar en los foros aprenderaprogramar.com.

EJERCICIO 2

Crea un código que represente el siguiente esquema de herencia permitiendo instanciar los subtipos pasándole los parámetros necesarios para inicializar las propiedades de los supertipos. Crea un objeto ProfesorTitular profesorTitular1 al que le pases como parámetros 8 (años trabajados), Universidad de León (institución académica), Juan (nombre), e invoca el método saludar sobre este objeto.

SOLUCIÓN EJERCICIO1:

Código: [Seleccionar]


<!DOCTYPE html>

<html>

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

    <script type="text/javascript">

        function persona(nombre, nacionalidad) { this.nombre = nombre || 'Desconocido'; this.nacionalidad = nacionalidad || 'Desconocida' };
        persona.prototype.mostrarNacionalidad = function () { var msg = 'La nacionalidad es: ' + this.nacionalidad; alert(msg); };

        function medico(centroDeTrabajo, nombre, nacionalidad) {
            persona.call(this, nombre, nacionalidad);
            this.centroDeTrabajo = centroDeTrabajo || 'Desconocido'
        };
        medico.prototype = new persona();

        function medicoEspecialista(especialidad, centroDeTrabajo, nombre, nacionalidad) {
            medico.call(this, centroDeTrabajo, nombre, nacionalidad);
            this.especialidad = especialidad || 'Desconocida'
        };
        medicoEspecialista.prototype = new medico();

        function ejemploHerencia() {
            var especialista1 = new medicoEspecialista('traumatologo', 'San Lucas', 'Ernesto', 'Uruguayo');
            var msg = 'El especialista1 tiene especialidad ' + especialista1.especialidad + ' y trabaja en ' + especialista1.centroDeTrabajo;
            msg = msg + '\n\n su nombre es ' + especialista1.nombre;
            alert(msg);
            especialista1.mostrarNacionalidad();
        }
    </script>
</head>

<body>
    <div id="cabecera">
        <h2>Cursos aprenderaprogramar.com</h2>
        <h3>Ejemplos JavaScript</h3>
    </div>

    <div style="color:blue;" id="pulsador" onclick="ejemploHerencia()"> Ejemplo Herencia </div>

</body>

</html>

SOLUCIÓN EJERCICIO 2:

Código: [Seleccionar]


<!DOCTYPE html>

<html>

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

    <script type="text/javascript">

        persona.prototype.definicion = 'Individuo de la especie humana.';
        function persona(nombre) {
            this.nombre = nombre;
            this.saludar = function () { alert('Hola ' + this.nombre+'!!'); };
        }
        profesor.prototype = new persona();

        function profesor(institucion, nombre) {
            persona.call(this, nombre);
            this.institucionAcademica = institucion;
        }

        profesorInterino.prototype = new profesor();
        function profesorInterino(meses, institucion, nombre) {
            profesor.call(this, institucion, nombre);
            this.mesesContrato = meses;
        }

        profesorTitular.prototype = new profesor();
        function profesorTitular(meses, institucion, nombre) {
            profesor.call(this, institucion, nombre);
            this.mesesContrato = meses;
        }

        function SaludarProfesor() {
            profesor1 = new profesorTitular(3, 'UBA', 'Conrado Lynch');

            msg = 'El profesor titular se llama ' + profesor1.nombre + ' y trabaja en la institucion ' + profesor1.institucionAcademica;
            msg = msg + '\n\n Su contrato es de ' + profesor1.mesesContrato + ' meses.';
            alert(msg);
            profesor1.saludar();

        }

    </script>
</head>

<body>
    <div id="cabecera">
        <h2>Cursos aprenderaprogramar.com</h2>
        <h3>Ejemplos JavaScript</h3>
    </div>

    <div style="color:blue;" id="pulsador" onclick="SaludarProfesor()"> Ejemplo Herencia </div>

</body>

</html>

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / Curso Básico de JavaScript. Funciones JavaScript validar formulario ver CU01142E

« en: 31 de Marzo 2020, 19:36 »

Solucion al ejercicio CU01142E del curso básico de programador JavaScript de aprenderaprogramar

Consignas:

Citar

EJERCICIO

Crea un documento HTML (página web) donde exista un formulario que se envíe por el método GET. Se pedirá al usuario que introduzca nombre, apellidos y correo electrónico. Define dentro de la etiqueta form que cuando se produzca el evento onsubmit (pulsación del botón de envío del formulario) se ejecute una función a la que denominaremos validar que no recibe parámetros.

La función validar debe realizar estas tareas y comprobaciones:

a) Comprobar que el nombre contiene al menos tres letras. Si no es así, debe aparecer un mensaje por pantalla indicando que el texto no cumple tener al menos tres letras. Por ejemplo si se trata de enviar Ka como nombre debe aparecer el mensaje: “El nombre no cumple tener al menos tres letras”.

b) Comprobar que el correo electrónico contiene el carácter @ (arroba) y el carácter . (punto). De no ser así, deberá aparecer un mensaje indicando que al correo electrónico le falta uno o ambos caracteres. Por ejemplo si se trata de enviar pacogmail.com deberá aparecer el mensaje: “Falta el símbolo @ en el correo electrónico”.

c) Antes de enviarse los datos del formulario a la página de destino, todas las letras del correo electrónico deben transformarse a minúsculas. Por ejemplo si se ha escrito PACO@GMAIL.COM debe enviarse paco@gmail.com
d) Antes de enviarse los datos del formulario a la página de destino, si el correo electrónico contiene la subcadena “ at “ debe reemplazarse por el símbolo @. Por ejemplo si se ha escrito paco at gmail.com debe enviarse paco@gmail.com

SOLUCIÓN

Código: [Seleccionar]


<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>Ejercicio CUO1142E</title>
    <style type="text/css">
    body{
        background-color: lemonchiffon;
        font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;    
    }
    label{
        font-size: large;
        padding: 7px;
        display: block;
    }
    </style>
    <script>

        function validar(){
            var textoIngresado=document.getElementsByTagName('input');
            var nombre=textoIngresado[0].value;var correo=textoIngresado[2].value;
            var apellido=textoIngresado[1].value;
            var arroba=correo.indexOf('@');var punto=correo.indexOf('.');
            
            
           
            if (nombre.length<3) {
                alert('El Nombre no cumple tener al menos tres letras');
            }
            if (arroba==-1||punto==-1){
                alert('compruebe que al correo electrónico no le falte el @ o el punto');
                    }

            nombre.toLowerCase();
            apellido.toLowerCase();
            correo.toLowerCase();

            var subcadenaAt=correo.replace (/at/g, '@');
           
        }


    </script>
</head>

<body>
    <h2>Ejercicio CUO1142 del curso básico de JavaScript</h2>
    <form action="" onsubmit="validar()" method="GET" name="cuestionario" id="formulario">
        <label for="nombre"><span>Nombre:</span> <input id="nombre" type="text" name="nombre" /></label>

        <label for="apellidos"><span>Apellidos:</span> <input id="apellidos" type="text" name="apellidos" /></label>

        <label for="email"><span>Correo electrónico:</span> <input id="email" type="text" name="email" /></label>

        <label><input type="submit" value="Enviar"><input type="reset" value="Cancelar"></label>
    </form>

</body>

</html>

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / JavaScript ejercicio resuelto diferencia ámbito global local innerHTML CU01138E

« en: 26 de Marzo 2020, 19:09 »

Resolución ejercicio del Curso de programación web con JavaScript CU01138E:

Código: [Seleccionar]


<html>

<head>
    <title>Ejemplo Inner HTML</title>
    <meta charset="utf-8">
    <style type="text/css">
        .divprimario {
            width: 400px;
            height: 400px;
            border: 1px solid black;
            margin: auto;
            display: flex;
            flex-wrap: wrap;
        }

        .divsecundario {
            width: 198px;
            height: 198px;
            border: 1px solid black;
            text-align: center;
            font-size: 32px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .boton {
            padding: 10px;
            font-size: 16px;
            font-weight: 600;
            background-color: beige;
            position: relative;
            left: 42%;
            margin: 40px;
            cursor: pointer;
        }

        .boton:hover {
            background-color: chocolate;
            color: darkgreen;
        }
    </style>

    <script type="text/javascript">
       var click = 0
        function cambiarColor() {
            click = click + 1;
            var nodoDiv = document.getElementsByClassName('divsecundario');
            if (click == 1) {
                nodoDiv[0].innerHTML = '<div style=\'background-color:black; color:white; height:100%; width: 100%; margin:auto;display:flex; align-items:center; justify-content:center;\'>El</div>';
            }
            else if (click == 2) {
                nodoDiv[1].innerHTML = '<div style=\' height:100%; width: 100%; margin:auto;display:flex; align-items:center; justify-content:center;\'>poder</div>';
            }
            else if (click == 3) {
                nodoDiv[2].innerHTML = '<div style=\' height:100%; width: 100%; margin:auto;display:flex; align-items:center; justify-content:center;\'>de</div>';
            }
            else if (click == 4) {
                nodoDiv[3].innerHTML = '<div style=\' background-color:yellow;color:black;height:100%; width: 100%; margin:auto;display:flex; align-items:center; justify-content:center;\'>JavaScript</div>';
            }
            else { alert('No es posible avanzar mas'); }

        }

    </script>
</head>

<body>
    <h1 style="text-align: center;">Ejercicio de Inner-HTML</h1>
    <div class="divprimario">
        <div class="divsecundario">?</div>
        <div class="divsecundario">?</div>
        <div class="divsecundario">?</div>
        <div class="divsecundario">?</div>
    </div>
    <button type="button" class="boton" onclick="cambiarColor()">Avanzar</button>
</body>

</html>

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / Ejercicios resueltos JavaScript Acceder a elementos por selectores CSS CU01134E

« en: 24 de Marzo 2020, 16:33 »

Ejercicio CU01134E del certificado formativo en JavaScript desde cero de aprenderaprogramar resuelto:

Código: [Seleccionar]

<!DOCTYPE html>
<html><head><title>Ejemplo aprenderaprogramar.com</title><meta charset="utf-8">
<style type="text/css">
body {font-family: sans-serif; text-align:center;}
#calculadora {    font: bold 14px Arial,sans-serif; background-color: #9DD2EA;
border-radius: 3px; height: auto; margin: 0 auto;  padding: 20px 20px 9px; width: 295px;
}
.parteSuperior .pantalla {
background-color: rgba(0, 0, 0, 0.2); border-radius: 3px; color: #FFFFFF; float: right; font-size: 17px;
height: 40px; letter-spacing: 1px; line-height: 40px; padding: 0 10px; text-align: right; width: 180px;
}
.teclas, .parteSuperior {overflow: hidden; }
.teclas span, .parteSuperior span.limpiar {     background-color: #FFFFFF; border-radius: 3px; color: #888888;
 cursor: pointer; float: left; height: 36px; line-height: 36px; margin: 0 7px 11px 0;
 text-align: center; transition: all 0.4s ease 0s; width: 66px;
}
.parteSuperior span.limpiar { background-color:#FF7C87;}
.teclas span.operador { background-color: #FFDAB9; margin-right: 0; }
.teclas span.igual { background-color: #F1FF92; color: #888E5F;}
.parteSuperior span.limpiar, { background-color: #FF9FA8; color: #FFFFFF; }
.teclas span:hover, .teclas span.igual:hover, .parteSuperior span.limpiar:hover { background-color: #9C89F6;
color: #FFFFFF; }
 
#contenedor {width:285px;margin: 40px auto; overflow:hidden;}
#marcaNumeros, #marcaOperadores {padding:15px; width: 90px; display: inline-block;
margin: 10px; cursor: pointer; color: white; border-radius: 40px; background: rgb(202, 60, 60);}
#marcaNumeros:hover, #marcaOperadores:hover {background: rgb(66, 184, 221);}
</style>
 
<script type="text/javascript">
 
function marcarOperadores() {
var listaNodosOperadores = document.querySelectorAll("#calculadora .teclas span.operador");
var nodoIgual = document.querySelector (".igual");
       for (var i=0; i<listaNodosOperadores.length; i++) {
                listaNodosOperadores[i].style.backgroundColor = "yellow";
                listaNodosOperadores[i].style.color = "black";
                listaNodosOperadores[i].style.border = "solid 1px";
                }
                nodoIgual.style.backgroundColor = "yellow";
                nodoIgual.style.color = "black";
                nodoIgual.style.border = "solid 1px";
}
 
function marcarNumeros() {
var listaNodosNumeros = document.querySelectorAll("#calculadora .teclas span.numero");
       for (var i=0; i<listaNodosNumeros.length; i++) {
                listaNodosNumeros[i].style.backgroundColor = "black";
                listaNodosNumeros[i].style.color = "white";
                listaNodosNumeros[i].style.border = "solid 1px";
                }
}
function marcarC(){
	var nodoC= document.querySelector(".limpiar");
	nodoC.style.backgroundColor="rgb(202, 60, 60)";
	nodoC.style.color="white";
}
	
function marcarPunto(){
	var nodoPunto= document.querySelector(".punto");
	nodoPunto.style.backgroundColor="#65089B";
	nodoPunto.style.color="white";
}
function marcarPantalla(){
	var nodoPantalla= document.querySelector(".pantalla");
	nodoPantalla.style.backgroundColor="#0531B3";
	nodoPantalla.style.color="white";
}
function limpiar(){
	var listaNodosOperadores = document.querySelectorAll("#calculadora .teclas span.operador");
var nodoIgual = document.querySelector (".igual");
       for (var i=0; i<listaNodosOperadores.length; i++) {
                listaNodosOperadores[i].style.backgroundColor = "#FFDAB9";
                listaNodosOperadores[i].style.color = "#888888";
                listaNodosOperadores[i].style.border = "none";
                }
                nodoIgual.style.backgroundColor = "yellow";
                nodoIgual.style.color = "#888888";
                nodoIgual.style.border = "none";
var listaNodosNumeros = document.querySelectorAll("#calculadora .teclas span.numero");
       for (var i=0; i<listaNodosNumeros.length; i++) {
                listaNodosNumeros[i].style.backgroundColor = "#FFFFFF";
                listaNodosNumeros[i].style.color = "#888888";
                listaNodosNumeros[i].style.border = "none";
                }
	var nodoC= document.querySelector(".limpiar");
	nodoC.style.backgroundColor="#FFFFFF";
	nodoC.style.color="#888888";
var nodoPunto= document.querySelector(".punto");
	nodoPunto.style.backgroundColor="#FFFFFF";
	nodoPunto.style.color="#888888";
	var nodoPantalla= document.querySelector(".pantalla");
	nodoPantalla.style.backgroundColor="rgba(0, 0, 0, 0.2)";
	nodoPantalla.style.color="white";
}
</script>
</head>
<body>
<div id="cabecera">
<h2>Cursos aprenderaprogramar.com</h2>
<h3>Ejemplo calculadora JavaScript</h3>
</div>
<!-- Calculadora -->
<div id="calculadora">
                <!-- pantalla y tecla limpiar -->
                <div class="parteSuperior">
                               <span class="limpiar" onclick="pulsada('C')">C</span>
                               <div class="pantalla"> </div> <!--Ojo tenemos un espacio para que exista nodeValue-->
                </div>
               
                <div class="teclas">
                               <!-- operadores y otras teclas -->
                               <span class = "numero" onclick="pulsada('7')">7</span>
                               <span class = "numero" onclick="pulsada('8')">8</span>
                               <span class = "numero" onclick="pulsada('9')">9</span>
                               <span class="operador" onclick="pulsada('+')">+</span>
                               <span class = "numero" onclick="pulsada('4')">4</span>
                               <span class = "numero" onclick="pulsada('5')">5</span>
                               <span class = "numero" onclick="pulsada('6')">6</span>
                               <span class="operador" onclick="pulsada('-')">-</span>
                               <span class = "numero" onclick="pulsada('1')">1</span>
                               <span class = "numero" onclick="pulsada('2')">2</span>
                               <span class = "numero" onclick="pulsada('3')">3</span>
                               <span class="operador" onclick="pulsada('/')">÷</span>
                               <span class = "numero" onclick="pulsada('0')">0</span>
                               <span class ="punto" onclick="pulsada('.')">.</span>
                               <span class="igual" onclick="pulsada('=')">=</span>
                               <span class="operador" onclick="pulsada('*')">x</span>
                </div>
</div>
<div id="contenedor">
<div id ="marcaNumeros" onclick="marcarNumeros()"> Marcar números </div>
<div id="marcaOperadores" onclick="marcarOperadores()" >Marcar operadores</div>
<div id ="marcaNumeros" onclick="marcarC()"> Marcar C </div>
<div id ="marcaNumeros" onclick="marcarPunto()"> Marcar punto </div>	
<div id ="marcaNumeros" onclick="marcarPantalla()"> Marcar pantalla </div>	
<div id ="marcaNumeros" onclick="limpiar()"> Limpiar estilos </div>		
</div>
</body>
</html>

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / JavaScript ejercicios resueltos arreglos cómo saber número elementos CU01131E

« en: 22 de Marzo 2020, 15:03 »

Ejercicio CU01131E del tutorial pdf de programación JavaScript desde cero resuelto.

Código: [Seleccionar]


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

<style type="text/css">
body {background-color:white; font-family: sans-serif;}
p {font-size: 24px; color: maroon; float: left; margin:10px; border: solid black; padding:10px;}
.boton{padding:15px; width: 330px;  text-align:center; clear:both;
color: white; border-radius: 40px; background: rgb(202, 60, 60);}
.boton:hover {background: rgb(66, 184, 221);}
</style>

<script type="text/javascript">
function deletrear(){
var palabra=prompt('Escribe una palabra: \n\n');
var letra=new Array();
letra[0]='';
var msg = 'Palabra deletreada: \n\n';
for(var i=1;i<=palabra.length;i++){letra[i]=palabra.charAt(i-1);}
for(var i=1;i<=palabra.length;i++){msg=msg+'Letra '+ i+': '+letra[i]+'\n\n';}
	alert(msg);
}


function mostrarContParrafos(elemento)
{
	var eleObte = document.getElementsByTagName(elemento);
 	var msg ;
 	msg="Numero de Parrafos y Contenido \n\n";
	for (var i=1;i<=eleObte.length;i++) {
	 msg=msg+'Parrafo '+i+' contiene : '+ eleObte[i-1].firstChild.nodeValue +'\n'
	}
   alert(msg);
}
</script>
</head>

<body>
<h1>Portal web aprenderaprogramar.com</h1>
<h2>Didáctica y divulgación de la programación</h2>
<div style="width:500px; float:left; margin-bottom:30px;">
	<p>Banana</p>
		<p>lechuga</p>
		<p>Anana</p>
		<p>Jengibre</p>
		<p>Manzana</p>
		<p>Durazno</p>
		<p>Uva</p>
<h3 class="boton" onclick="deletrear()">Pulse para deletrear una palabra</h3>
<h3 class="boton" onclick="mostrarContParrafos('p')">Pulse aquí para mostrar el valor de los parrafos</h3>
</body>
</html>

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / Ejercicios resueltos JavaScript arreglos unidimensionales array recorre CU01121E

« en: 12 de Marzo 2020, 19:03 »

Solución propuesta para el ejercicio CU01121E del tutorial pdf de programación web con JavaScript de aprenderaprogramar:

Código: [Seleccionar]

<html>
<head>
<title>Curso JavaScript aprenderaprogramar.com</title> 
<meta charset="utf-8">
<script type="text/javascript">
  function mostrarMensaje1(){
   var Nombre1=prompt('Dime tu nombre');
   var Nombre2=prompt('Dime el nombre de tu padre');
   var Nombre3=prompt('Dime el nombre de tu madre');
   
   var Nombres=[Nombre1, Nombre2, Nombre3];
   var msg='Los nombres que escribiste son '+Nombres+'.'; alert(msg);
    }
  
</script>
</head>
<body>
<div>
<p>Aquí un párrafo de texto situado antes de la imagen, dentro de un div contenedor</p>
<img onclick="mostrarMensaje1()" src="http://i.imgur.com/afC0L.jpg" alt="Notepad++" title="Notepad++, un útil editor de texto">
<p onclick ="alert('Alerta JavaScript')" style="color: #D2691E;">Aquí otro párrafo de texto. JavaScript es un lenguaje utilizado para dotar de efectos dinámicos a las páginas web.
</p>
</div>
</body>
</html>

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / JavaScript ejercicios resueltos condicional if then elseif código html CU01119E

« en: 11 de Marzo 2020, 20:26 »

Propuesta de solución al ejercicio del capitulo CU01119E del curso básico de JS desde cero a ver si está ok.

Código: [Seleccionar]

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

<script type="text/javascript">
function mostrarMensaje1() {
var diametro, grosor;
diametro = prompt ('Por favor introduce el diametro de la rueda en metros:');
diametro=Number(diametro);
grosor = prompt ('Por favor introduce el grosor de la rueda en metros:');
grosor=Number(grosor);
   
if (diametro =="") { alert ('No has introducido ningún diametro'); }
else {alert ("El diametro introducido es "+diametro + "."); }         
if (grosor =="") { alert ('No has introducido ningún grosor');}
else {alert ("El grosor introducido es "+grosor + "."); }         
if(diametro>1.4){alert("La rueda es para un vehículo grande");}
else if(diametro<=1.4 && diametro>0.8){alert("La rueda es para un vehículo mediano");}
else if(diametro<=0.8 && diametro>0){alert("La rueda es para un vehículo pequeño");}
else {alert("El número ingresado no es válido");}

if(diametro>1.4 && grosor<0.4){alert("El grosor para esta rueda es inferior al recomendado");}
else if(diametro<=1.4 && grosor>=0.4){alert("El grosor para esta rueda es inferior al recomendado");}
else if(grosor<0.4){alert("Introdujo un numero negativo. Introduzca numeros positivos por favor");}
else{alert("el grosor esta ok.")};
   }
</script>

</head>
<body>
<div>
<p>Bienvenido a la pagina grosa de las ruedas</p>
   <p onclick="mostrarMensaje1()"> CLICK AQUI PARA EMPEZAR LOS CALCULOS </p>
.
</p>
</div>
</body>
</html>

Páginas: [1]

Foros aprenderaprogramar.com
Didáctica y divulgación de la programación

Noticias: