JavaScript. Calcular IVA y total.

Crea un documento HTML con campo para la base imponible, iva y total, junto con un boton para el calculo.
Al pulsar el boton que ejecute una funcion javascript para los calculos y los muestre en los campos correspondientes.

15 JavaScript. Arrow function

 Vemos otra forma de crear funciones en #javaScript, la #funcionFlecha o #arrowFunction

14 JavaScript. Map / Filter

Aplicando funcion #map y #filter a un #array con #javascript, obteniendo valores segun #funcion pasada.

11 JavaScript. Funciones

 Funciones con JavaScript

//funcion sin parametro y sin retorno de valor

function mostrar(){

    document.write('Hola desde la funcion<br/>');

}

for(let i=0;i<10;i++){

    mostrar();

}

//funcion con parametro

function imprimir(nombre){

    document.write(`Hola, ${nombre}<br/>`);

}

imprimir('Jose');

imprimir('Lucia');

//funcion que devuelve resultado

function mayor(val1,val2){

    let mayor = 0;

    if(val1>val2){

        mayor = val1;

    }else{

        mayor = val2;

    }

    return mayor;

}

document.write(mayor(4,56));

let numeroMayor = mayor(4,8);

document.write(`<br/>El numero mayor es = ${numeroMayor}`);

05 JavaScript. Contador de tiempo

Creamos un contador de tiempo para nuestra web, para ello usamos HTML, CSS y JavaScript.

El codigo es:

HTML

<!DOCTYPE html>
<html>
<head>
<link href="css/estilo.css" rel="stylesheet" type="text/css">
<title>
Contador
</title></head>
<body>
<section>
<div id="contenido">
<article>
<div id="tiempo">
<h5 id="titulo">
<span>Horas</span>
<span>Minutos</span>
<span>Segundos</span>
</h5>
<h2 id="contador">
<span id="horas">00</span>
<span id="minutos">00</span>
<span id="segundos">00</span>
</h2>
</div>
</article>
</div></section>
<script src="js/tiempo.js"></script>
</body></html>

CSS

 body{
    margin:0 auto;
    max-width:98%;
    font-family: Helvetica, Arial;
    font-size:14px;

}
#titulo{
    font-size:1.3em;
    text-align:center;
    margin-top:5em;
    padding:1.3em;
    color:#434343;
}
#contador{
    font-size:2.2em;
    text-align:center;
    color:#434343;
}

JavaScript

 var horas,minutos,segundos;
horas=0;
minutos=0;
segundos=0;
hor=document.getElementById("horas");
min=document.getElementById("minutos");
seg=document.getElementById("segundos");
function tiempo(){
    var contador=0;
    window.setInterval(function(){
        if(contador<10){
            seg.innerHTML="0"+contador;
        }else{
            seg.innerHTML= contador;
        }
        if(contador>59){
            segundos=0;
            contador=0;
            minutos=minutos+1;
        }
        if(minutos>59){
            minutos=0;
            horas=horas+1;
        }
        if(horas>23){
            horas=0;
           
        }
        if(minutos<10){
            min.innerHTML="0"+minutos;
        }else{
            min.innerHTML=minutos;
        }
        if(horas<10){
            hor.innerHTML="0"+horas;
        }else{
            hor.innerHTML=horas;
        }
        contador++;
    },1000);
}
tiempo();

05 Javascript Repeticion Funcion cada cierto tiempo

Para probar este ejemplo pulsemos en nuestro navegador firefox Ctrl+Shift+I con lo que abriremos la consola, donde podremos probar directamente el codigo javascript que explico a continuacion:

function Muestra(){
     alert("Esto se repite cada X segundos");
}
//aqui llamamos a la funcion anterior dandole el intervalo de repeticion
setInterval(Muestra,3000);

La primera parte del codigo es para crear la funcion a la que damos el nombre "Muestra", consiste en lanzar una ventana mostrando el texto que pusimos entre los parentesis del alert.
Despues procedemos a llamar a la funcion dentro de setInterval que indica cada cuanto tiempo se realizara la llamada a dicha funcion, en este caso cada tres segundos.
Este ejemplo, a pesar de ser corto y sencillo muestra como desarrollar una funcion, llamarla y  realizar dicha llamada cada cierto tiempo.