HTML DOM Input Search defaultValue প্রপার্টি

HTML DOM Input Search defaultValue প্রপার্টি সার্চ ফিল্ডের ডিফল্ট ভ্যালু সেট বা পাওয়ার জন্য ব্যবহৃত হয়। একটি এলিমেন্টের defaultValue হলো তার value অ্যাট্রিবিউটে দिये गये মান। value এবং defaultValue প্রপার্টির পার্থক্য হলো defaultValue প্রপার্টি মূল ডিফল্ট মান ধরে রাখে যখন value প্রপার্টির মান ইউজার ইনপুটের উপর ভিত্তি করে পরিবর্তন হয়।

সিনট্যাক্স

defaultValue প্রপার্টি সেট করার সিনট্যাক্স:

searchObject.defaultValue = value

এখানে, "value" হলো সার্চ ফিল্ডের ডিফল্ট মান।

উদাহরণ

Search defaultValue প্রপার্টির উদাহরণ:

<!DOCTYPE html> <html> <body> 
<h1>Input Search defaultValue Property</h1> 
<form> FRUITS: <input type="search" id="SEARCH1" name="fruits" value="MANGO"> </form> 
<p>Change the above search field default value by clicking on the CHANGE button</p> 
<button type="button" onclick="changeDefault()">CHANGE</button> 
<p id="Sample"></p> 
<script> 
  function changeDefault() { 
    document.getElementById("SEARCH1").defaultValue = "APPLE"; 
    var P = document.getElementById("SEARCH1").defaultValue; 
    document.getElementById("Sample").innerHTML = "Default value has been changed from MANGO to " + P; 
  } 
</script> </body> </html>

আউটপুট

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

HTML DOM Input Search defaultValue প্রপার্টি

CHANGE বাটনে ক্লিক করলে:

HTML DOM Input Search defaultValue প্রপার্টি

উপরের উদাহরণে:

আমরা প্রথমে type="search", id="SEARCH1", name="fruits" এবং এর value অ্যাট্রিবিউট "MANGO" সেট করে একটি <input> এলিমেন্ট তৈরি করেছি। সার্চ ফিল্ডটি একটি ফর্মের ভিতরে আছে।

<form> FRUITS: <input type="search" id="SEARCH1" name="fruits" value="MANGO"> </form>

তারপর আমরা একটি CHANGE বাটন তৈরি করেছি যা ইউজার ক্লিক করলে changeDefault() মেথড এক্সিকিউট করবে।

<button type="button" onclick="changeDefault()">CHANGE</button>

changeDefault() মেথড getElementById() মেথড ব্যবহার করে টাইপ সার্চवाले ইনপুট ফিল্ডটি পেয়ে তার defaultValue প্রপার্টি "APPLE" সেট করে। তারপর আবার getElementById() মেথড ব্যবহার করে টাইপ সার্চवाले ইনপুটের defaultValue প্রপার্টি পেয়ে ভেরিয়েবল P-তে অ্যাসাইন করে। এই ভেরিয়েবলটি প্যারাগ্রাফের innerHTML প্রপার্টি ব্যবহার করে "Sample" আইডি والے প্যারাগ্রাফে দেখানো হয়।

function changeDefault() { 
  document.getElementById("SEARCH1").defaultValue = "APPLE"; 
  var P = document.getElementById("SEARCH1").defaultValue; 
  document.getElementById("Sample").innerHTML = "Default value has been changed from MANGO to " + P; 
}