Skip to content

Instantly share code, notes, and snippets.

@anthony17guty

anthony17guty/gist:3731a0a8956af07beff5314a8233b21d

Created August 6, 2019 02:51
Show Gist options
  • Save anthony17guty/3731a0a8956af07beff5314a8233b21d to your computer and use it in GitHub Desktop.
Save anthony17guty/3731a0a8956af07beff5314a8233b21d to your computer and use it in GitHub Desktop.
Download ZIP
Raw
gistfile1.txt
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Fibonacci Solver</title>
</head>
<body>
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<style>
.container {
max-width: 450px;
height: auto;
background-color:gray;
margin: 5% auto;
padding-bottom: 1rem;
padding: 25px;
}
</style>
</head>
<body>
<div class="container" id="formulario">
<h1>GENERADOR FIBONACCI</h1>
<!-- Comentarios de la parte de html-->
<!--la etiqueta <form> es donde se pone el contenido interactivo -->
<form action="">
<!-- "action" sirve para mandar información con ayuda de código js-->
<label for="num1">Primer : </label>
<input type="text" name="num1" id="num1">
<!-- Aquí lo mas importante es el atributo name y id que se
van ha ocupar para capturar el valor ingresado mediante
javascript -->
<br>
<label for="num2">Segundo: </label>
<input type="text" name="num2" id="num2">
<br>
<label for="maximo">Máximo : </label>
<input type="text" name="maximo" id="maximo">
<br>
<br>
<input type="button" value="Calcular serie" id="btnSolver">
<br>
<input type="search" value="Buscar" id="btnSolver" />
</form>
<br>
<input type="button" value="Ver Tabla" id="btnTabla">
<br>
<input type="button" value="Par" id="btnpar">
<br>
<input type="button" value="Impar" id="btnimpares">
<br><br><br>
<table id="tablaSerie" class="table table-borderless" border="1">
<tbody id="tbody">
</tbody>
</table>
<tbody id="tablapares">
</tbody>
</table>
</body>
<script>
// aquí crea una función que resive 3 parametros
function Solver(primero, segundo, maximo) {
this.primero = primero;
this.segundo = segundo;
this.maximo = maximo;
this.serie = []; // crea un array sin definir tu tamaño
this.generar = generar;
function generar() {
this.serie=[];
this.serie.push(this.primero) // push es un método que sirve para añadir elementos a un array en este caso al array "serie"
this.serie.push(this.segundo);
}
}
var listaTodos = []; // aquí crea otro array con el fin de guardar el resultado del otro array
var listaPares=[];
var listaImpares=[];
var par=function(num){
if(num%2===0){
return true;
}
else false;
}
var generadorFibonacci = function (anterior, ultimo) {
if (anterior + ultimo > maximoValorSerie) { // aquí valida para que no el valor máximo de la serie no pueda ser mayor que la
return listaTodos; // suma del anterior y el ultimo así que también podría ir >= "mayor igua
} else {
nuevo = anterior + ultimo;
if(par(nuevo)){
listaPares.push(nuevo)
}else{
listaImpares.push(nuevo)
} // aquí ya esta realizando la opetacion de 1+1+2+3+5
listaTodos.push(nuevo); // aquí ya esta realizando la opetacion de 1+1+2+3+5
return generadorFibonacci(ultimo, nuevo); // aquí retorna el método con sus dos parametros que son obligatorios por que fueron definidos así
}
}
listaPares.push(2)
listaImpares.push(1)
/* con el "getElementById" hace refencia al botón "botonSolver" línea 31 con el fin de
añadir un evento el EventListener que reacciona cuando se da click y activa la función*/
document.getElementById("btnSolver").addEventListener("click", function () {
primerFibo = parseInt(document.getElementById("num1").value); //aquí de igual maneta captura mediente el id puesto en el html los valores ingresados por el etiquete <input>
segundoFibo = parseInt(document.getElementById("num2").value);
maximoValorSerie = parseInt(document.getElementById("maximo").value);
listaTodos.push(primerFibo); // añade los nuevos valores al array "listaTodos"
listaTodos.push(segundoFibo);
generadorFibonacci(primerFibo, segundoFibo);
}
);
var tabla = document.getElementById("tbody"); //toma el valor del "tbody" línea 37
document.getElementById("btnTabla").addEventListener("click", function () {
// divta.style.display = "block"
for (var i = 0; i < listaTodos.length; i++) { // recorre al array con un for
var tr = document.createElement("tr" + "td" + "td") // mediante "createElement" crea la etiqueta "tr" y "td"
var td = document.createElement("td")
td.appendChild(document.createTextNode(listaTodos[i])); // en esta línea agrega el elemento "i" al array "listaTodos" que serian todos los números generados especificados con el número "máximo"
tr.appendChild(td); // aquí añada cada elemente td creado
tabla.appendChild(tr) // y aquí el tr
}
})
//toma el valor del "tbody" línea 37
document.getElementById("btnpar").addEventListener("click", function () {
// divta.style.display = "block"
for (var i = 0; i < listaPares.length; i++) { // recorre al array con un for
var tr = document.createElement("tr" + "td" + "td") // mediante "createElement" crea la etiqueta "tr" y "td"
var td = document.createElement("td")
td.appendChild(document.createTextNode(listaPares[i])); // en esta línea agrega el elemento "i" al array "listaTodos" que serian todos los números generados especificados con el número "máximo"
tr.appendChild(td); // aquí añada cada elemente td creado
tabla.appendChild(tr) // y aquí el tr
}
})
document.getElementById("btnimpares").addEventListener("click", function () {
// divta.style.display = "block"
for (var i = 0; i < listaImpares.length; i++) { // recorre al array con un for
var tr = document.createElement("tr" + "td" + "td") // mediante "createElement" crea la etiqueta "tr" y "td"
var td = document.createElement("td")
td.appendChild(document.createTextNode(listaImpares[i])); // en esta línea agrega el elemento "i" al array "listaTodos" que serian todos los números generados especificados con el número "máximo"
tr.appendChild(td); // aquí añada cada elemente td creado
tabla.appendChild(tr) // y aquí el tr
}
})
</script>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment