En este artículo, aprenderá a crear una , HTML y CSS. Este tipo de calculadora de préstamos lo ayudará a calcular cuánto debe pagar por mes por el monto de su préstamo. Entonces la calculadora podrá calcularte muy fácilmente. calculadora de préstamos usando JavaScript Muchas de estas calculadoras que ya he hecho son notables entre ellas , de javascript. Si conoce JavaScript, puede crearlo fácilmente. calculadora de IMC usando javascript calculadora de edad Calculadora de préstamos usando JavaScript Primero creé un cuadro en la página web. Usé un encabezado en ese cuadro usando las etiquetas h1. Luego están los tres cuadros de entrada. El primer cuadro de entrada para ingresar el monto del préstamo, el segundo cuadro de entrada para ingresar el porcentaje de la tasa de interés y el tercer cuadro de entrada para ingresar el mes de pago (cuántos meses tomará pagar el préstamo). para aprender cómo funciona. Aquí he tratado de dar una explicación completa de cómo hice esta calculadora de préstamos de JavaScript. Mire su demostración en vivo Al final de todo, hay una pantalla que ayudará a mostrar el resultado. Como decía, esta calculadora de préstamos podrá calcular cuánto tienes que pagar al mes con intereses. Tomé la ayuda de HTML CSS y JavaScript para hacerlo. HTML CSS lo diseñó y JavaScript lo implementó. 1. Cree un cuadro para Calculadora de préstamos Primero lo diseñé usando HTML y CSS. Creé un cuadro usando el siguiente código HTML. El ancho de este cuadro: 345px, y el color de fondo es completamente blanco. height: 420px <div id="loancal"> </div> body{ background: rgb(8, 144, 110); font-family: sans-serif; } #loancal { width: 345px; height: 420px; background-color:white; color: #fff; padding: 10px; margin: 100px auto; } 2. Crea un título Ahora he usado un encabezado. Este encabezado no tiene un significado especial, pero se ha utilizado para realzar la belleza. y se utiliza el color azul para aumentar el tamaño del encabezado. Font-size: 30px <h1>Loan Calculator</h1 h1 { font-size:30px; text-align: center; color: rgb(9, 95, 172); margin-bottom: 35px; } 3. Haz 3 cuadros de entrada Ahora he creado unos 3 cuadros de entrada para ingresar información relacionada con el préstamo. Los cuadros de entrada son principalmente para ingresar el monto del préstamo, la tasa de interés y el mes de pago total. Los valores mínimos y máximos se establecen para cada cuadro de entrada. Puede ingresar su información entre ese valor mínimo y máximo. <div class="input"> <p>Loan Amount: $</p> <input id="amount" type="number" min="1" max="5000000" onchange="computeLoan()"> <p>Interest Rate: %</p> <input id="interest_rate" min="0" max="100" value="10" step=".1" onchange="computeLoan()"> <p>Months to Pay: </p> <input id="months" type="number" min="1" max="300" value="1" step="1" onchange="computeLoan()"> </div> .input{ margin-left: 40px; margin-right: 40px; } p{ color: rgb(17, 103, 170); font-size: 17px; } input{ width: 100%; height: 33px; } 4. Crea una pantalla para ver los resultados Ahora es el momento de crear un área pequeña. Los resultados se pueden encontrar en esta área. Aquí y color blue se usan para colocar el texto en el medio. text-align: center <h2 id="payment"></h2> h2{ text-align: center; color: rgb(6, 111, 139); margin-top: 35px; } 5. Código JavaScript para Calculadora de préstamos Si conoce el , seguramente los diseños anteriores no son un problema para que lo entienda. Ahora es el momento de hacerlo completamente operativo. HTML CSS básico Si conoce , puede comprender fácilmente el siguiente código JavaScript. He puesto la información necesaria en cada línea aquí. JavaScript básico function computeLoan(){ //The global constants of some class functions(value) are determined using the following three line codes const amount = document.querySelector('#amount').value; const interest_rate = document.querySelector('#interest_rate').value; const months = document.querySelector('#months').value; //The interest rate has been calculated. //The total amount of interest per month has been calculated by the following calculation. //That calculation is stored in a constant called "interest" const interest = (amount * (interest_rate * 0.01)) / months; //The bottom line calculates how much to pay each month. //Here the total amount is divided by the month (which you will input) and the monthly interest is added to it. //All these calculations are stored in a constant called "payment". let payment = ((amount / months) + interest).toFixed(2); //regedit to add a comma after every three digits //That is, a comma (,) will be added after every three numbers. //Example 50,000 payment = payment.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); //With the help of innerHTML, the information stored in the "payment" is displayed on the webpage. document.querySelector('#payment').innerHTML = `Monthly Payment = ${payment}` } Con suerte, el tutorial anterior le ha ayudado a saber cómo crear esta calculadora de préstamos de JavaScript. Ya he compartido cómo hacer una . calculadora de IMC de JavaScript Si necesita para hacer esta calculadora de préstamos, puede obtener la ayuda del enlace de descarga a continuación. descargar el código Publicado por primera vez aquí

2022 - HackerNoon Contributor of the Year - Css3

2022 - HackerNoon Contributor of the Year - Html

2022 - HackerNoon Contributor of the Year - Website Development

Nominated for 2022 - HackerNoon Contributor of the Year - Html

Nominated for 2022 - HackerNoon Contributor of the Year - Css3

Nominated for 2022 - HackerNoon Contributor of the Year - Website Development

Este audio es producido en el idioma original de la historia!

Demasiado Largo; Para Leer

Making security fun one episode at a time

Cree una calculadora de préstamos de JavaScript con HTML y CSS

Demasiado Largo; Para Leer

Shantanu Jana

About Author

ETIQUETAS

Languages

ESTE ARTÍCULO FUE PRESENTADO EN...

Cree una calculadora de préstamos de JavaScript con HTML y CSS

Demasiado Largo; Para Leer

Shantanu Jana

About Author

ETIQUETAS

Languages

ESTE ARTÍCULO FUE PRESENTADO EN...

HISTORIAS RELACIONADAS