Posts

Showing posts from June, 2024

text to speech

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Text to Speech Generator</title>     <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">     <link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css" rel="stylesheet">     <style>         body {             background-color: #f0f4f8;             padding: 20px;         }         .header {             text-align: center;             margin-bottom: 20px;         }         .voice-buttons {            ...
Post a Comment
Read more

Create Table in Functions

  function tbles ( n ){     for ( let i = n ; i <= n * 10 ; i += n ){         console . log ( i );     } } tbles ( 7 )
Post a Comment
Read more

how to find average no in function

  function caAvg ( a , b , c ) {     let avg = ( a + b + c ) / 3     console . log ( avg ); } caAvg ( 2 , 4 , 7 )
Post a Comment
Read more

Guess The Number Game Js

  let max = prompt ( "enter the number" ) console . log ( max ); const random = Math . floor ( Math . random () * 5 ) let guess = prompt ( "enter the correct number" ) while ( true ){     if ( guess == "quit" ){         console . log ( "user quit" );         break ;     }     if ( guess == random ){         console . log ( "you are write" );         break ;     }     else if ( guess < random ){         guess = prompt ( "your guess was to small" )     }         else {         guess = prompt ( "your guess was to Large" )       }     // else {     //     guess = prompt("your guess was wrong please try again")     // } }
Post a Comment
Read more

random interger generator

 let step1 = Math.random() console.log(step1) let step2 = step1 * 10 console.log(step2) let step3 = Math.floor(step2) console.log(step3) let step4 = step3 + 1 console.log(step4) ======================================= Easy way Math.floor(Math.random()*100) + 1
Post a Comment
Read more

Make notepad with dom

  <! DOCTYPE html > < html > < head >   < meta charset = "utf-8" >   < meta name = "viewport" content = "width=device-width" >   < title > replit </ title >   < link href = "style.css" rel = "stylesheet" type = "text/css" /> </ head > < body > < h1 > My Text Editor </ h1 > < p ></ p > < input placeholder = "type something" id = "text" >   < script src = "index.js" ></ script > </ body > </ html > let inp = document . querySelector ( "#text" ) let p = document . querySelector ( "p" ) inp . addEventListener ( "input" , function (){     console . log ( inp . value );     p . innerText = inp . value })
Post a Comment
Read more

form event second

<! DOCTYPE html > < html > < head >   < meta charset = "utf-8" >   < meta name = "viewport" content = "width=device-width" >   < title > replit </ title >   < link href = "style.css" rel = "stylesheet" type = "text/css" /> </ head > < body > < form action = "/action" >   < input placeholder = "User name" type = "text" id = "user" >   < input placeholder = "Password"   type = "password" id = "passw" >   < button > Register </ button > </ form >   < script src = "index.js" ></ script > </ body > </ html >   let form = document . querySelector ( "form" ) form . addEventListener ( "submit" , function (){ event . preventDefault () }) let user = document . querySelector ( "#user" ) us...
Post a Comment
Read more

form even dom

  <! DOCTYPE html > < html > < head >   < meta charset = "utf-8" >   < meta name = "viewport" content = "width=device-width" >   < title > replit </ title >   < link href = "style.css" rel = "stylesheet" type = "text/css" /> </ head > < body > < form action = "/action" >   < input placeholder = "User name" >   < button > Register </ button > </ form >   < script src = "index.js" ></ script > </ body > </ html > let form = document . querySelector ( "form" ) form . addEventListener ( "submit" , function (){     event . preventDefault ()     alert ( "form submit" ) })
Post a Comment
Read more

keyboard dom 11

<! DOCTYPE html > < html > < head >   < meta charset = "utf-8" >   < meta name = "viewport" content = "width=device-width" >   < title > replit </ title >   < link href = "style.css" rel = "stylesheet" type = "text/css" /> </ head > < body > < input placeholder = "Move your character" > < button > click me </ button >   < script src = "index.js" ></ script > </ body > </ html >   let inp = document . querySelector ( "input" ) inp . addEventListener ( "keydown" , function (){     if ( event . code == "KeyU" ){         console . log ( "ch move fordward" )     }     else if ( event . code == "KeyD" ){         console . log ( "ch move back" )     }     else if ( event . code == "KeyA" ){         console . log ( "ch ...
Post a Comment
Read more

keyword event dom

  <! DOCTYPE html > < html > < head >   < meta charset = "utf-8" >   < meta name = "viewport" content = "width=device-width" >   < title > replit </ title >   < link href = "style.css" rel = "stylesheet" type = "text/css" /> </ head > < body > < input placeholder = "Move your character" > < button > click me </ button >   < script src = "index.js" ></ script > </ body > </ html > ------------------------------------------------------------------- let inp = document . querySelector ( "input" ) inp . addEventListener ( "keydown" , function (){     // console.log("key was pressed");     console . log ( event . Key );     console . log ( event . code ); }) // inp.addEventListener("keyup", function (){ //     console.log("key was release"); // })
Post a Comment
Read more

All ements ka color change

  <! DOCTYPE html > < html > < head >   < meta charset = "utf-8" >   < meta name = "viewport" content = "width=device-width" >   < title > replit </ title >   < link href = "style.css" rel = "stylesheet" type = "text/css" /> </ head > < body >   < h1 > This is this function in dom </ h1 >   < h2 > lets do parctice </ h2 >   < h3 > lets get start </ h3 >   < p > Lorem ipsum dolor sit amet, consectetur adipisicing elit. Excepturi quos architecto nemo asperiores atque impedit. Nihil, deleniti? Obcaecati perferendis minus ratione voluptates deleniti, laudantium inventore unde possimus deserunt aliquam nemo. </ p > < button > click me </ button >   < script src = "index.js" ></ script > </ body > </ html > -----------------------------------------------------------------...
Post a Comment
Read more

dom basic practice

<! DOCTYPE html > < html > < head >   < meta charset = "utf-8" >   < meta name = "viewport" content = "width=device-width" >   < title > replit </ title >   < link href = "style.css" rel = "stylesheet" type = "text/css" /> </ head > < body > < h1 > This is heading </ h1 > < div class = "box" ></ div >   < script src = "index.js" ></ script > </ body > </ html > body {     text-align : center ; } div {     height : 100px ;     width : 1000px ;     border : 1px solid black ;     margin : auto ; } let h1 = document . querySelector ( "h1" ) h1 . addEventListener ( "click" , function (){     console . log ( "h1 was clicked" ); }) let box = document . querySelector ( ".box" ) box . addEventListener ( "mouseenter" , function (){     console ...
Post a Comment
Read more

Random Color Generator

<! DOCTYPE html > < html > < head >   < meta charset = "utf-8" >   < meta name = "viewport" content = "width=device-width" >   < title > replit </ title >   < link href = "style.css" rel = "stylesheet" type = "text/css" /> </ head > < body > < h1 > generate a random color </ h1 > < button > Click me </ button > < div > This is your new color </ div >   < script src = "index.js" ></ script > </ body > </ html > body {     text-align : center ; } div {     height : 100px ;     width : 1000px ;     border : 1px solid black ;     margin : auto ; } let btn = document . querySelector ( "button" ); btn . addEventListener ( "click" , function (){     let h3 = document . querySelector ( "h1" );     let randomColor = getRandomColor ();     h3 . innerText...
Post a Comment
Read more

Dblclick

<! DOCTYPE html > < html > < head >   < meta charset = "utf-8" >   < meta name = "viewport" content = "width=device-width" >   < title > replit </ title >   < link href = "style.css" rel = "stylesheet" type = "text/css" /> </ head > < body >   < button > click Me </ button >   < button > click e </ button >   < button > click M </ button >   < script src = "index.js" ></ script > </ body > </ html >   let btns = document . querySelectorAll ( "button" ) for ( btn of btns ){ //   btn.addEventListener("click", lo); //   btn.addEventListener("click", ame);   btn . addEventListener ( "dblclick" , function me (){     console . log ( "double click" ); });  } // function lo(){ //     alert("Hello"); // } // function ame(){ //     a...
Post a Comment
Read more

Basic dom - II

  <! DOCTYPE html > < html > < head >   < meta charset = "utf-8" >   < meta name = "viewport" content = "width=device-width" >   < title > replit </ title >   < link href = "style.css" rel = "stylesheet" type = "text/css" /> </ head > < body >   < button > click Me </ button >   < button > click e </ button >   < button > click M </ button >   < script src = "index.js" ></ script > </ body > </ html > --------------------------------------------------------------------------------- let btns = document . querySelectorAll ( "button" ) for ( btn of btns ){     btn . onclick = sayHello ;     btn . onmouseenter = function (){         console . log ( "you enter a btn" );     } } function sayHello (){     alert ( "Hello" ) }
Post a Comment
Read more

Basic dom

  <! DOCTYPE html > < html > < head >   < meta charset = "utf-8" >   < meta name = "viewport" content = "width=device-width" >   < title > replit </ title >   < link href = "style.css" rel = "stylesheet" type = "text/css" /> </ head > < body >   < button onclick = " console . log ('button was clicked')" > click Me </ button >   < script src = "index.js" ></ script > </ body > </ html > --------------------------------------------------- let btn = document . querySelector ( "button" ) console . dir ( btn ); function func (){     alert ( "btn was clicked" ) } btn . onclick = func
Post a Comment
Read more

 Create a Function to roll a dice & always display the value of the dice (1 to 6).

  function ran (){   let rand = Math.floor(Math.random() * 6) + 1 console.log(rand); } ran()
Post a Comment
Read more

create a function thet print poem

 function poem (){ console.log("twinkle twinkle little star ") console.log("kese hai") } poem  ()
Post a Comment
Read more

Arrays practice

 let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; console.log(arr); console.log(arr.toString()); // convert into string console.log(arr.join(" and ")); console.log(arr[1]); arr.pop(); console.log(arr); console.log(arr.length); arr.push(13); arr.shift(); arr.unshift(11); console.log(arr);
Post a Comment
Read more

function practice()

 function hello (){   console.log("hello") } hello() // ----------------------------------------------------------------  function name (){   console.log("navjot singh") } name() // --------------------------------------------------------------------  function print (){   for(let i = 1; i<=5; i++){     console.log(i)   } } print() // ------------------------------------------------------------------------------  function practice(){   for(let i = 1; i<10; i++){     console.log(i)   } } practice() // ---------------------------------------------------------------  function isa (){   let age = 69   if(age<18){     console.log("you are not eligible")   }   else if(age>70){     console.log("your age is old")   }   else{     console.log("you are eligible")   } } isa(17) // ----------------------------------------------------------  // Ho...
Post a Comment
Read more