Posts

Showing posts from April, 2025

Switch ,Array, Events in JavaScript

Image
 Switch  <html> <head>   <title>Switch Case with Buttons</title> </head> <body> <label for="a">Enter the first number:</label> <input type="number" id="num1"><br> <label for="b">Enter the second number:</label> <input type="number" id="num2"><br><br>   <button id="button1">Add</button>   <button id="button2">Mod</button>   <button id="button3">Del</button><br><br>   <div id="show"></div>   <script>   function fun1()   {   const a = parseFloat(document.getElementById("num1").value);   const b = parseFloat(document.getElementById("num2").value);      const c=a+b;   document.getElementById('show').innerHTML =  'Addition is ='+c ;   }    function fun2()   {   const a = parseFloat(document.getElementB...

Form Validation in JavaScript

Form Validation  <html> <head><title>validation form</title> <style> body{ display:flex; justify-content:center; align-items:center; } input[type=number]{ width:300px; border:none; outline:none; border-bottom:2px solid orange; } input[type=Password]{ width:300px; border:none; outline:none; border-bottom:2px solid orange; } input[type=text]{ width:300px; border:none; outline:none; border-bottom:2px solid orange; } input[type=submit]{ height:30px; width:80px; font-size:20px; border-radius:10px; } label{ width:50px; text-align:right; } .d{ width:100px; text-align:right; font-size:20px; } .d2{ height:50px; text-align:center; } div{ border-radius:16px; background-color:#afa; } </style> </head> <body><div> <form> <table> <tr><td class="d"><label for="nm">UserId :</label></td> <td class="d1"><input type="text" name="uid"required></tr...

JavaScript

Image
JavaScript JavaScript JavaScript is nothing but client side scripting language, which is developed by Brendan Eich in 1995. Client-side scripting means program executed in the client web browser. JavaScript not only make web page more attractive but also validate client input before submitting data to a server. DOM in JavaScript DOM stand for Document Object Model; it is a programming interface for web page DOM traversing using JavaScript World Wide Web Consortium HTML DOM standard tells us all HTML document(program) is a node. Like its all element, text, other data etc. We can categorized HTML document like, ·         According to above hierarchy HTML is root node, head and body is child node, and so on. ·         The HTML DOM slandered defines the html element as Object, properties, methods, events. ·      ...

nav tag Navigation Menu

Image
  <nav> tag The <nav> tag can create navigation menus on web pages. It is a semantic and block-level HTML element. Navigation menu provides users with an easy and attractive way to access web pages. Example: <html> <head> <title>simple navigation</title></head> <body> <div style="width:100%; height:80px;background-color:gray; float:left"></div> <div style="width:100%; height:30px;background-color:pink;float:left"> <nav> <a href="#">HOME</a> <a href="#">ABOUT US</a> <a href="#">CONTACT</a> </nav> </div> </body> </html> OUTPUT Example <html> <head> <title>formated navigation</title> <style> *{ margin:0px; padding:0px; } .d1{ width:100%; height:90px; float:left; background-image:linear-gradient(#ff0022,#f45,#ff0022); } h1{ text-align:cente...