Javascript. Acceso elementos DOM

 

HTML CSS. Ejercicio formulario de acceso

 

Extensiones Visual Studio Code

 

Javascript. Extension Quokka para visual studio

 

JavaScript. Persistencia de datos

Persistencia de #datos, grabar y recuperar datos del usuario con #localStorage en #javascript

CSS. Flex box

 Diseño de cajas usando Flex box

JavaScript. Ventana aviso cookies

 Crea tu propia ventana de #aviso #cookie usando #html, #css y #javascript

32 JavaScript. Ejercicio linterna.

Ejercicio practico en el que se crea una linterna que se apaga o enciende al hacer click en la imagen.

31 JavaScript. Cambiar color dinamicamente

En el siguiente #video vemos como cambiar el color primario y secundario de la #web mediante #javascript, con el que cambiaremos el archivo #css que se cargara para mostrar el color del sitio.

Reto. Clona la siguiente web.

Propongo como reto crear la siguiente #web segun el ejemplo del video 👇

En #youtube he publicado la guia para crearla, para mostrar el progreso lo indicaremos en redes con el Hashtag #asiQuedaMiWeb. Te apuntas?. #josecodetech #crezcamosjuntos #html #css

30 JavaScript. Animaciones

Animaciones con #jquery

28 JavaScript. Objeto Event

 Objeto Event, #javascript + libreria #jquery

29 JavaScript. Lista de tareas basica

 Ejemplo de creacion de una lista de tareas basicas con JavaScript.

27 JavaScript. Eventos jquery

Eventos desde #javascript con la libreria #jquery

26 JavaScript. Manipula el DOM desde JQuery

 Manipula el DOM desde JQuery 

Codigos de los ejemplos en GitHub

Ya he subido a #github el codigo usado en tutorial #javascript / #jquery

https://github.com/ticoticotaa/Tutorial-JavaScript

25 JavaScript. Manipulando CSS

 Manipulando CSS desde JavaScript usando la libreria JQuery.

JavaScript. Guia de programacion

Ya tengo publicada la guia de introduccion a la #programacion con #javascript 👉https://www.amazon.es/dp/B08VGSC61Q

Es una pequeña introduccion a javascript donde se ven los conceptos basicos y algunos ejemplos sencillos para adentrarse en la programacion #web.

Espero os sea util. Gracias.

24 JavaScript. Atributos, contenido

Acceder a contenido y atributos html desde jquery

Portatil para comenzar, caracteristicas

Para empezar a programar no es necesario un portatil o pc que nos cueste un dineral, podemos iniciarnos con ordenadores mas sencillos, os pongo los requisitos minimos que recomendaria:

    8 gb Ram
    256 SSD de disco principal
    512 Gb de disco secundario
    el procesador i5 (recomiendo intel)

Con estas caracteristicas voy a poner 3 ejemplos:

    1. Lenovo IdeaPad 3 - Portátil 15.6" FullHD (Intel Core i5-1035G1, 8GB RAM, 512GB SSD, Intel UHD Graphics, Windows 10 Home), Color gris

        Puedes obtenerlo aqui 

 

 

     2. HP Pavilion Gaming 16-a0005ns - Ordenador portátil de 16.1" FHD (Intel Core i5-10300H, 8GB RAM, 512GB SSD, Nvidia GTX 1050-3GB, sin sistema operativo) negro

    Puedes obtenerlo aqui 

    3. Acer Aspire 3 - Portátil 15.6" FullHD (Intel Core i5-1035G1, 12GB RAM,512GB SSD, UMA Graphics, Sin Sistema Operativo), Color Negro 

 

     Puedes obtenerlo aqui

 

 

23 JavaScript. Intro JQuery

 Introduccion a la libreria #jquery

22 JavaScript. Ejercicio con array

1. Solicita al usuario 6 numeros y muestra el valor mayor y menor.

window.onload = function(){

    //console.log('Hola');

    var mayor = 0;

    var menor=99999;

    var numeros = [];

    //captura de datos

    for(var i=0;i<6;i++){

        numeros[i]=parseInt(prompt('Dime un numero y te indicare cual es el mayor de los seis...'));        

    }

    //recorremos array y comprobamos cual es el mayor / menor

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

        if(numeros[i]>mayor){

            mayor = numeros[i];

        }

        if(numeros[i]<menor){

            menor = numeros[i];

        }

    }

    console.log('Hemos terminado de comprobar');

    console.log(`El numero mayor es ${mayor}`);

    console.log(`El numero menor es ${menor}`);

}

2. Igual que el ejercicio anterior pero que solicite numeros hasta que el usuario indique "fin".

window.onload = function(){

    //console.log('Hola');

    var mayor = 0;

    var menor=99999;

    var numeros = [];

    var usuario = "";

    do{

        usuario = prompt('Dime un numero o escribe "fin" para terminar');

        if (usuario!='fin'){

            usuario = parseInt(usuario);

            numeros.push(usuario);

        }

    }while(usuario!='fin');

  

    //recorremos array y comprobamos cual es el mayor / menor

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

        if(numeros[i]>mayor){

            mayor = numeros[i];

        }

        if(numeros[i]<menor){

            menor = numeros[i];

        }

    }

    if(numeros.length>2){

        console.log('Hemos terminado de comprobar');

        console.log(`El numero mayor es ${mayor}`);

        console.log(`El numero menor es ${menor}`);

    }else{

        console.log('No hay numeros suficientes para comprobar mayor y menor');

    }

}

21 JavaScript. Ejercicios basicos

1. Solicitar un numero al usuario y mostrarle la tabla de multiplicar.

//tabla de multiplicar numero dado por usuario

let tabla = parseInt(prompt("Tabla del ... ?"));

for (let contador = 1; contador <= 10; contador++){

    let resultado = tabla * contador;

    console.log(`${tabla} * ${contador} = ${resultado}`);

}

2. Solicitar 2 números y realizar las 4 operaciones básicas.

//solicitar 2 numeros y hacer las operaciones basicas

let numero1 = parseInt(prompt("Dime el primer numero "));

let numero2 = parseInt(prompt("Dime el segundo numero "));

console.log("Procedo a calcular las operaciones basicas");

let suma = numero1 + numero2;

let resta = numero1 - numero2;

let multiplicacion = numero1 * numero2;

let division = numero1 / numero2;

console.log(`Suma = ${suma}`);

console.log(`Resta = ${resta}`);

console.log(`Multiplicacion = ${multiplicacion}`);

console.log(`Division = ${division}`);

3. Solicitar un numero e indicar si es positivo o no.

//positivo negativo

let numero = parseInt(prompt("Dime un numero y te indico si es positivo o no ..."));

if(numero > 0){

    console.log(`El numero ${numero} es positivo`);

} else if (numero < 0){

    console.log(`El numero ${numero} es negativo`);

} else {

    console.log('El numero es igual a cero');

}

4. Sumar todos los números entre dos valores dados por el usuario.

//suma entre dos valores dados

let numero1 = parseInt(prompt("Dime el primer numero "));

let numero2 = parseInt(prompt("Dime el segundo numero "));

let suma = 0;

for (numero1; numero1 <= numero2; numero1++){

    suma = suma + numero1;

}

console.log(`La suma de todos los numeros del intervalo dado es = ${suma}`);

5. Sumar pares por un lado e impares por otro, según intervalo dado por el usuario.

//suma de pares e impares entre dos valores dados

let numero1 = parseInt(prompt("Dime el primer numero "));

let numero2 = parseInt(prompt("Dime el segundo numero "));

let pares = 0;

let impares = 0;

for (numero1; numero1 <= numero2; numero1++){

    if (numero1 % 2 === 0){

        pares = pares + numero1;

    } else {

        impares = impares + numero1;

    }

}

console.log(`La suma de todos los numeros pares del intervalo dado es = ${pares}`);

console.log(`La suma de todos los numeros impares del intervalo dado es = ${impares}`);

6. Simular entrada a sistema solicitando usuario y clave, mostrar saludo si usuario es admin y contraseña 1234, en caso contrario seguir solicitando datos acceso.

//usuario contraseña

let usuario = prompt('Usuario ?');

let password = prompt('Contraseña ?');

while (usuario !== "admin" & password !== "1234"){

    console.log("Usuario o password incorrecto");

    usuario = prompt('Usuario ?');

    password = prompt('Contraseña ?');

}

console.log(`Bienvenido, ${usuario}`);

7. Añadir al ejercicio anterior solo 3 intentos.

window.onload = function(){

//usuario contraseña con 3 intentos

let usuario = prompt('Usuario ?');

let password = prompt('Contraseña ?');

let intentos = 1;

while (usuario !== "admin" & password !== "1234"){

    if (intentos > 2){

        console.log('No puedes intentarlo mas');

        break;

    }

    console.log("Usuario o password incorrecto");

    usuario = prompt('Usuario ?');

    password = prompt('Contraseña ?');

    intentos++;

    console.log(intentos);

}

if (intentos <= 3){

    console.log(`Bienvenido, ${usuario}`);

}else{

    console.log('No has entrado al sistema');

}

}

Si quieres ver los ejercicios en video, 

20 JavaScript. Comprobar dato introducido

 Ejemplo para comprobar si el dato introducido por el usuario es numerico o no.

19 JavaScript. BOM

 Accede a propiedades y metodos del navegador web desde JavaScript.

18 JavaScript. DOM

 Interactua con el documento HTML desde JavaScript.