Random Color Generator – JavaScript

Denna handledning kommer att demonstrera proceduren för att generera slumpmässiga färger i JavaScript.

Hur genererar man slumpmässig färg i JavaScript?

För att generera slumpmässig färg i JavaScript, använd ' Math.random()*16 ” metod som skapar ett slumptal mellan 0 och 16. Detta beror på att det är ett sätt att generera ett slumpmässigt hexadecimalt värde, som kan användas för att skapa en slumpmässig färg.

Exempel 1: Generera slumpmässig färg
I en HTML-fil kommer vi att skapa en behållare och lägga till ett -element som genererar de slumpmässiga färgerna på knappen:

< span id = 'colorContainer' >
< knapp-id = 'btn' > Klicka för att generera slumpmässig färg knapp >
spänna >

Lägg nu till den nedan angivna koden i JavaScript-filen eller

---

• Först har vi definierat en funktion ' colorGenerator() där vi skapar en hexSiffror ” matris med hexadecimala tal från 0 till 9 och A till F.
• Skapa en variabel ' färg kod ”.
• Använd sedan ' för ' loop, vid varje iteration, metoderna för ' Matematik Objekt genererar ett slumptal mellan 0 och 16.
• Skicka det resulterande indexnumret till 'hexDigits' och lagra motsvarande indexvärde i variabeln 'colorCode'.
• Processen upprepas 6 gånger för att skapa en 6-siffrig kod.
• Lägg slutligen till den här koden med ' # ” underteckna och återgå till funktionen.

Bifoga nu ' addEventListener() ”-metoden på knappens klickhändelse. Kalla den definierade funktionen ' colorGenerator() ” för att ändra bakgrundsfärgen för hela kroppen:

btn. addEventListener ( 'klick' , ( ) => {
dokumentera. kropp . stil . bakgrundsfärg = färggenerator ( ) ;
} ) ;

Produktion

Exempel 2: Generera slumpmässig färg med kod
Här kommer vi att skriva ut motsvarande slumpmässigt genererade färgkod med färgen med hjälp av ' innerHTML ' fast egendom:

btn. addEventListener ( 'klick' , ( ) => {
dokumentera. kropp . stil . bakgrundsfärg = färggenerator ( ) ;
dokumentera. getElementById ( 'färg kod' ) . innerHTML = färggenerator ( ) ;
} ) ;

Utdata visar motsvarande färgkod med relevant bakgrundsfärg för kroppen:

Det handlade om den slumpmässiga färggeneratorn i JavaScript.

Slutsats

För att generera slumpmässig färg i JavaScript, skapa en 6-siffrig kod med ' Matematik ' objektmetoder i ' för ” slinga. Vid varje iteration genereras en färgkodssiffra och efterökning i en variabel. Denna färgkod returneras med '#' i början. Denna handledning demonstrerade proceduren för att generera slumpmässiga färger i JavaScript.