Códigos Fuente de JavaScript

Mostrando del 1 al 10 de 866 registros
<<>>
Imágen de perfil
Val: 3.340
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript
Actualizado

Cambiar el color de fondo (background) cada vez que se carga la pagina


JavaScript

Actualizado el 9 de Abril del 2021 por Joel (145 códigos) (Publicado el 31 de Diciembre del 2020)
621 visualizaciones desde el 31 de Diciembre del 2020
Simple código que muestra como poner aleatoriamente un color de fondo (background-color) diferente cada vez que se carga la pagina.
Los colores para el fondo de pantalla se encuentra en un array.
Imágen de perfil
Val: 3.340
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Incrementar un valor en un tiempo determinado


JavaScript

estrellaestrellaestrellaestrellaestrella(1)
Publicado el 8 de Abril del 2021 por Joel (145 códigos)
85 visualizaciones desde el 8 de Abril del 2021
Este código muestra como incrementar un valor, desde un valor inicial hasta un valor final con un intervalo dado, y en un tiempo determinado.

incrementar-valor-en-un-determinado-tiempo


El elemento que se va a incrementar, tiene que tener el estilo "counter" y hay que definir:
data-from-value -> valor inicial
data-to-value -> valor final
data-increment -> valor de incremento
data-duration -> duración para llegar del valor inicial al valor final

Se muestra la manera de añadir el valor del Euro o porcentaje utilizando el estilo ::after
Imágen de perfil
Val: 1.973
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Convertir las urls de un texto en enlace HTML


JavaScript

Publicado el 5 de Abril del 2021 por Katas (174 códigos)
171 visualizaciones desde el 5 de Abril del 2021
Función que recibe un texto plano, y devuelve el mismo texto pero con las urls en formato HTML (<a href="....">) para que puedan ser pulsadas por el usuario en la web.

1
2
3
4
console.log(urlTextToHTML("la url: https://www.dom.au esta ok")); // "la url: <a href="https://www.dom.au" target="_blank">https://www.dom.au</a> esta ok"
console.log(urlTextToHTML("la url: https://www.dom.au/index.html esta ok")); // "la url: <a href="https://www.dom.au/index.html" target="_blank">https://www.dom.au/index.html</a> esta ok"
console.log(urlTextToHTML("las urls: https://dom.au y https://www.dom.au estan ok")); // "las urls: <a href="https://dom.au" target="_blank">https://dom.au</a> y <a href="https://www.dom.au" target="_blank">https://www.dom.au</a> estan ok"
console.log(urlTextToHTML("texto sin url")); // "texto sin url"

Para quitar el tag html añadido al enlace, puedes utilizar la función urlHTMLToText() https://www.lawebdelprogramador.com/codigo/JavaScript/6994-Quitar-el-codigo-HTML-de-las-urls-de-un-texto.html
Imágen de perfil
Val: 1.973
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Quitar el código HTML de las urls de un texto


JavaScript

Publicado el 5 de Abril del 2021 por Katas (174 códigos)
167 visualizaciones desde el 5 de Abril del 2021
Función que recibe un texto con enlaces en formato HTML, y devuelve el mismo texto pero quitando el formato HTML (<a href="....">).

1
2
3
4
console.log(urlHTMLToText('la url: <a href="https://www.dom.au" target="_blank">https://www.dom.au</a> esta ok')); // "la url: https://www.dom.au esta ok"
console.log(urlHTMLToText('la url: <a href="https://www.dom.au/index.html" target="_blank">https://www.dom.au/index.html</a> esta ok')); // "la url: https://www.dom.au/index.html esta ok"
console.log(urlHTMLToText('las urls: <a href="https://dom.au" target="_blank">https://dom.au</a> y <a href="https://www.dom.au" target="_blank">https://www.dom.au</a> estan ok')); // 'las urls: https://dom.au y https://www.dom.au estan ok'
console.log(urlHTMLToText('texto sin url')); // "texto sin url"

Esta función hace lo contrario que la función urlTextToHTML() https://www.lawebdelprogramador.com/codigo/JavaScript/6993-Convertir-las-urls-de-un-texto-en-enlace-HTML.html
Imágen de perfil
Val: 1.973
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Añadir ceros o cualquier valor delante de un numero


JavaScript

Publicado el 2 de Abril del 2021 por Katas (174 códigos)
152 visualizaciones desde el 2 de Abril del 2021
Función de JavaScript para añadir ceros o cualquier carácter delante de un numero.

1
2
3
4
5
6
7
8
9
10
11
LeadingZero(123, 0); // "123"
LeadingZero(123, 1); // "123"
LeadingZero(123, 2); // "123"
LeadingZero(123, 3); // "123"
LeadingZero(123, 4); // "0123"
LeadingZero(123, 5); // "00123"
LeadingZero(123, 6); // "000123"
LeadingZero("123", 6); // "000123"
LeadingZero(123, 6, "x"); // "xxx123"
LeadingZero(123, 6, "-"); // "---123"
LeadingZero(1, 10, "casa"); // "acasacasa1"
Imágen de perfil
Val: 3.376
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Calcular la media de un array de números


JavaScript

estrellaestrellaestrellaestrellaestrella(3)
Actualizado el 30 de Marzo del 2021 por Xve (294 códigos) (Publicado el 28 de Marzo del 2021)
286 visualizaciones desde el 28 de Marzo del 2021
Función que recibe un array de números, cuenta las repeticiones de cada uno de los números y calcula la media de cada uno.

1
2
3
4
console.log(obtenerMediaValores([1,2,2,2,3,5])); // {1: 1, 2: 3, 3: 1, 4: 0, 5: 1}
 
const arr=Array.from({length: 50}).map(el => Math.floor(Math.random() * 10));
console.log(obtenerMediaValores(arr)); // {0: 8, 1: 8, 2: 14, 3: 6, 4: 12, 5: 8, 6: 18, 7: 8, 8: 10, 9: 4}
Imágen de perfil
Val: 1.973
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Cambiar el color de las celdas de una tabla al pasar el ratón por encima


JavaScript

Publicado el 29 de Marzo del 2021 por Katas (174 códigos)
159 visualizaciones desde el 29 de Marzo del 2021
Este código muestra como cambia el color de las celdas de una tabla con un color aleatorio al pasar el ratón por encima.

tabla-color-celdas
Imágen de perfil
Val: 1.973
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Calcular la mediana de una lista de numeros


JavaScript

Publicado el 26 de Marzo del 2021 por Katas (174 códigos)
242 visualizaciones desde el 26 de Marzo del 2021
La mediana es el "número en el medio" de una lista ordenada de números si es par, en el caso de que sea impar, tenemos que encontrar el par central de números, y después calcular su valor medio.

1
2
3
4
5
mediana([1, 2, 3, 4, 5]); // 3
mediana([1, 2, 3, 4]); // 2.5
mediana([1, 2, 3]); // 2
mediana([1, 2]); // 1.5
mediana([1]); // 1


En el caso de que sea par, con la función slice() obtenemos un array con los dos valores del centro, el cual pasamos a la función reduce para que los sume y el resultado lo dividimos entre 2 para obtener la media.
1
arr.slice(l/2-1, l/2+1).reduce((a,b) => a+b)/2

En el caso de que sea impar, simplemente obtenemos el valor del medio con slice()
1
arr.slice((l/2), l/2+1)[0]
Imágen de perfil
Val: 1.973
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Crear un array de 10x10 con números aleatorios y ordenarlo verticalmente y horizontalmente


JavaScript

Publicado el 25 de Marzo del 2021 por Katas (174 códigos)
262 visualizaciones desde el 25 de Marzo del 2021
Mediante el generador de números aleatorios llenar una tabla de dos dimensiones (10,10) con números enteros comprendidos entre el 0 y el 99. La tabla deberá visualizarse en pantalla así como los números que se van generando, colocándoles en cada casilla de la tabla.
Ordenar la matriz anterior por filas y columnas, de menor a mayor.

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
Array original
 
[18, 80, 92, 90, 72, 29, 56, 20, 55, 22]
[91, 33, 73, 95, 22, 19, 67, 83, 98, 95]
[71, 60, 60, 24, 0, 56, 51, 93, 74, 88]
[61, 93, 83, 87, 30, 69, 41, 21, 66, 46]
[19, 16, 94, 57, 13, 97, 80, 51, 14, 52]
[41, 74, 94, 67, 40, 0, 47, 68, 39, 58]
[97, 37, 4, 38, 34, 31, 24, 68, 4, 54]
[37, 86, 42, 49, 0, 37, 40, 62, 85, 47]
[70, 68, 82, 47, 28, 55, 36, 30, 33, 80]
[29, 43, 32, 13, 89, 94, 59, 16, 41, 81]
 
Array ordenado horizontalmente
 
[18, 20, 22, 29, 55, 56, 72, 80, 90, 92]
[19, 22, 33, 67, 73, 83, 91, 95, 95, 98]
[0, 24, 51, 56, 60, 60, 71, 74, 88, 93]
[21, 30, 41, 46, 61, 66, 69, 83, 87, 93]
[13, 14, 16, 19, 51, 52, 57, 80, 94, 97]
[0, 39, 40, 41, 47, 58, 67, 68, 74, 94]
[4, 4, 24, 31, 34, 37, 38, 54, 68, 97]
[0, 37, 37, 40, 42, 47, 49, 62, 85, 86]
[28, 30, 33, 36, 47, 55, 68, 70, 80, 82]
[13, 16, 29, 32, 41, 43, 59, 81, 89, 94]
 
Array ordenado verticalmente
 
[0, 4, 16, 19, 34, 37, 38, 54, 68, 82]
[0, 14, 22, 29, 41, 43, 49, 62, 74, 86]
[0, 16, 24, 31, 42, 47, 57, 68, 80, 92]
[4, 20, 29, 32, 47, 52, 59, 70, 85, 93]
[13, 22, 33, 36, 47, 55, 67, 74, 87, 93]
[13, 24, 33, 40, 51, 56, 68, 80, 88, 94]
[18, 30, 37, 41, 55, 58, 69, 80, 89, 94]
[19, 30, 40, 46, 60, 60, 71, 81, 90, 97]
[21, 37, 41, 56, 61, 66, 72, 83, 94, 97]
[28, 39, 51, 67, 73, 83, 91, 95, 95, 98]


Para ordenar horizontalmente, se va recorriendo cada uno de las filas que contiene un array cada una, y se va ordenando con sort(). la función sort() ordena el array in-place, que significa que una vez se ejecuta sort() ya queda modificado.
1
arr.map(a => a.sort((a,b) => a-b));


Para ordenar verticalmente, recorremos el array por sus 10 elementos (del 0 a 9)
1
for (let i=0; i<arr.length; i++) {
y por cada uno de estos valores, obtenemos el valor de indice que hemos obtenido de cada uno de los arrays que contiene. Con esto conseguimos un array con los 10 elementos verticales de la fila "i". en primero lugar la primera columna, segunda columna, etc...
1
let arrVert=arr.map(a => a[i]);
Ordenamos sus valores:
1
arrVert.sort((a,b) => a-b);
Reemplazamos cada uno de los elementos en el array original por los que hemos ordenado
arr.map((a, index) => a[i]=arrVert[index]);


La explicación de como crear el array de 10x10 aquí: https://www.lawebdelprogramador.com/codigo/JavaScript/6969-Crear-un-array-bidimensional-de-10x10-con-numeros-aleatorios.html
Imágen de perfil
Val: 1.973
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Crear un array bidimensional de 10x10 con números aleatorios


JavaScript

Publicado el 25 de Marzo del 2021 por Katas (174 códigos)
490 visualizaciones desde el 25 de Marzo del 2021
Código que muestra como crear un array de 10x10 con números aleatorios entre el 0 y el 99

1
2
3
4
5
6
7
8
9
10
[52, 90, 89, 76, 71, 64, 45, 43, 11, 21]
[10, 91, 89, 3, 49, 23, 84, 19, 31, 56]
[3, 23, 26, 41, 4, 24, 20, 55, 90, 0]
[16, 93, 8, 40, 84, 24, 43, 77, 80, 67]
[47, 32, 18, 94, 52, 22, 32, 78, 85, 82]
[93, 12, 67, 71, 56, 27, 9, 81, 5, 94]
[52, 23, 15, 62, 24, 35, 5, 0, 52, 87]
[35, 63, 97, 64, 11, 20, 43, 68, 53, 47]
[39, 97, 61, 83, 14, 21, 76, 93, 25, 88]
[96, 32, 31, 13, 0, 50, 24, 12, 26, 53]

Definimos una constante como un array de 10 valores
1
const y=[..."1111111111"];

Mediante la función map(), recorremos cada uno de los elementos de la constante "y" y asignamos su valor a la variable "x", la cual es nuevamente asignada a la constante "y", la cual a su misma vez mediante la función map() nuevamente le asignamos un valor aleatorio a cada uno de sus 10 elementos, y es asignado a la variable "x" que modifica el primer valor de "y" que se asignara a la variable "arr".
1
let arr=y.map(x => y.map(el => Math.floor(Math.random() * 100)));