-
Notifications
You must be signed in to change notification settings - Fork 0
/
ej7_arrays.html
148 lines (122 loc) · 6.86 KB
/
ej7_arrays.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
<!DOCTYPE html>
<html lang="en">
<head>
<title>Javascript desde 0 con Ejercicios</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="p-5 bg-dark text-white text-center">
<h1>Bootcamp QA: Arrays</h1>
<p><a href="https://developer.mozilla.org/es/docs/Learn/JavaScript/First_steps/Arrays">Arrays Javascripts</a>
</p>
</div>
<br>
<div id="ejemploArrays" class="container mt-5">
<h3>Ejemplo 1: Crear un array y mostrarlo</h3>
<p>Mostrar una lista de la compra</p>
<p id="listaResultado1"></p>
<button type="button" class="btn btn-success" onclick="mostrarLista()">Mostrar Lista de la compra</button>
<h3> Ejemplo 2: Mostrar la longitud, el primer elemento y el ultimo del array</h3>
<button type="button" class="btn btn-success" onclick="mostrarInfoLista()">Mostrar Informacion de la
Lista</button>
<p id="listaResultado2"></p>
<h3>Ejempplo 3: Cambiar el valor de un elemento de la lista (EDITAR LISTA)</h3>
<form id="ejemplo3formulario" class="was-validated">
<div class="mb-3">
<input type="number" id="ej3posicion"
placeholder="Introduce la posicion del elemento que quieres modificar" required min="0">
<p class="valid-feedback">correcto</p>
<p class="invalid-feedback">El campo es obligatorio</p>
</div>
<div class="mb-3">
<input type="text" id="ej3elemento" placeholder="Introduce el nuevo elemento" required>
<p class="valid-feedback">correcto</p>
<p class="invalid-feedback">El campo es obligatorio</p>
</div>
<button type="button" class="btn btn-success" onclick="modificarLista()">Modificar Lista</button>
</form>
<p id="listaResultado3"></p>
<h3>Agregar elementos al final de la lista</h3>
<form id="ejemplo4formulario" class="was-validated">
<div class="mb-3">
<input type="text" id="ej4elemento" placeholder="Introduce el elemento que quieres agregar" required>
<p class="valid-feedback">correcto</p>
<p class="invalid-feedback">El campo es obligatorio</p>
</div>
<button type="button" class="btn btn-success" onclick="agregarLista()">Agregar</button>
</form>
<h3>Ejemplo5: Eliminar elementos del final de la lista</h3>
<button type="button" class="btn btn-success" onclick="eliminarElemento()">Eliminar</button>
<p id="listaResultado5"></p>
<h3>Ejemplo 6: eliminar un elemento concreto de la lista</h3>
<form id="ejemplo3formulario" class="was-validated">
<div class="mb-3">
<input type="number" id="ej6posicion"
placeholder="Introduce la posicion del elemento que quieres eliminar" required min="0">
<p class="valid-feedback">correcto</p>
<p class="invalid-feedback">El campo es obligatorio</p>
</div>
<button type="button" class="btn btn-success" onclick="eliminarElementoElegido()">Modificar Lista</button>
</form>
<p id="listaResultado6"></p>
<h3>Ejemplo 7: Ordenar lista por orden alfabetica ASSCI</h3>
<button type="button" class="btn btn-success" onclick="ordenarLista()">Ordenar Lista</button>
<p id="listaResultado7"></p>
<h3>Ejemplo 8: Ordenar lista por orden alfabetica ASSCI de Z hasta A</h3>
<button type="button" class="btn btn-success" onclick="ordenarListaZA()">Ordenar Lista de Z a A</button>
<p id="listaResultado7"></p>
<h3>Ejemplo 9: Obtner la posicion de un elemento de la lista, y -1 si no se encuentra</h3>
<form id="ejemplo9formulario" class="was-validated">
<div class="mb-3">
<input type="text" id="ej9posicion"placeholder="Introduce el elemento que quieres encontrar" required>
<p class="valid-feedback">correcto</p>
<p class="invalid-feedback">El campo es obligatorio</p>
</div>
<button type="button" class="btn btn-success" onclick="posicionElemento()">Modificar Lista</button>
<p id="listaResultado9"></p>
</form>
</div>
<div id="ejerciciosArrays" class="container mt-5">
<h3>Ejercicio 1: Agrega un boton mostrar alumnos, que al pulsarlo muestre una lista con los nombres de 10 alumnos.</h3>
<button type="button" class="btn btn-success" onclick="mostrarLista()">Modificar Lista</button>
<p id="respuesta1"></p>
<h3>Ejemplo 2: Muestra el nombre del alumno de la posicion que elijas</h3>
<form id="ejercicio2Formulario" class="was-validated">
<div class="mb-3">
<input type="number" id="ej2posicion"placeholder="Elija un numero" required min="0" max="10">
<p class="valid-feedback">correcto</p>
<p class="invalid-feedback">El campo es obligatorio</p>
</div>
<button type="button" class="btn btn-success" onclick="nombreAlumno()">Mostrar nombre</button>
</form>
<p id="respuesta2"></p>
<h3>Ejercicio 3: Agrega un boton mostrar alumnos ordenados, que muestre los alumnos ordenados por nombre.</h3>
<button type="button" class="btn btn-success" onclick="ordenarNombre()">Modificar Lista</button>
<p id="respuesta3"></p>
<h3>Ejercicio 4: Agrega una nueva opcion para agregar un nuevo alumno.</h3>
<form id="ejercicio4Formulario" class="was-validated">
<div class="mb-3">
<input type="text" id="ej4nombre"placeholder="Introduce el nombre que quieres agregar" required >
<p class="valid-feedback">correcto</p>
<p class="invalid-feedback">El campo es obligatorio</p>
</div>
<button type="button" class="btn btn-success" onclick="agregarAlumno()">Agregar Alumno</button>
</form>
<p id="respuesta4"></p>
<h4> Ejercicio 5: Agrega una opcion para eliminar un alumno de una posicion elegida.</h4>
<form id="ejercicio5Formulario" class="was-validated">
<div class="mb-3">
<input type="number" id="ej5posicion"placeholder="Elija un numero" required min="1" max="501">
<p class="valid-feedback">correcto</p>
<p class="invalid-feedback">El campo es obligatorio</p>
</div>
<button type="button" class="btn btn-success" onclick="eliminarAlumnoElegido()">Eliminar</button>
</form>
<p id="respuesta5"></p>
</div>
<script src="js/ej7_arrays.js"></script>
<script src="js/ej7_ejercicios_arrays.js"></script>
</body>
</html>