HTML DOM Input Hidden অবজেক্ট

HTML DOM Input Hidden অবজেক্ট

HTML DOM input hidden অবজেক্ট HTML ডকুমেন্টে type="hidden" এর সাথে <input> এলিমেন্টকে উপস্থাপন করে।

সিনট্যাক্স

ইনপুট হিডেন অবজেক্ট তৈরির সিনট্যাক্স:

var hiddenInput = document.createElement("INPUT"); hiddenInput.setAttribute("type","hidden");

প্রপার্টি

HTML DOM Input Hidden অবজেক্টের প্রপার্টিসমূহ:

উদাহরণ

HTML DOM input hidden অবজেক্টের উদাহরণ:

<!DOCTYPE html> <html> <head> <style> 
  body{ text-align:center; background-color:#F19A3E; color:#fff; }
  .btn{ background-color:#3C787E; border:none; height:2rem; border-radius:50px; width:60%; margin:1rem auto; display:block; color:#fff; }
  input{ border:1px solid #fff; background-color:transparent; color:#fff; padding:8px; outline:none; }
  input::placeholder{ color:#fff; font-weight:bold; } 
</style> </head> <body> 
<h1>DOM Input Hidden Object Example</h1> 
<input type="text" placeholder="Enter your name" class="input-field"> 
<button onclick="showHide()" class="btn">Click to show/hide input field</button> 
<script> 
  function showHide() { 
    var inputField = document.querySelector(".input-field"); 
    if(inputField.type === 'text'){ 
      inputField.type='hidden'; 
    } else { 
      inputField.type='text'; 
    } 
  } 
</script> </body> </html>

আউটপুট

এটি নিচের আউটপুট তৈরি করবে:

"Click to show/hide input field" বাটনে ক্লিক করলে ইনপুট ফিল্ড হাইড হবে।