HTML DOM ইনপুট ইমেজ অবজেক্ট একটি HTML ডকুমেন্টের type=”image” সহ উপাদানকে উপস্থাপন করে।
আসুন দেখি কিভাবে ইনপুট ইমেজ অবজেক্ট −
তৈরি করতে হয়সিনট্যাক্স
নিচের সিনট্যাক্স −
var imageInput = document.createElement(“INPUT”); imageInput.setAttribute(“type”,”image”);
সম্পত্তি
HTML DOM ইনপুট ইমেজ অবজেক্ট -
এর বৈশিষ্ট্যগুলি নিম্নরূপসম্পত্তি | ব্যাখ্যা |
---|---|
Alt | এটি একটি ইনপুট ইমেজের Alt অ্যাট্রিবিউটের মান ফিরিয়ে দেয় এবং পরিবর্তন করে। |
অটোফোকাস | ব্রাউজারটি HTML ওয়েব পৃষ্ঠায় একটি ছবি লোড করা শেষ করেছে কিনা তা ফেরত দেয়। |
ডিফল্ট মান | এটি একটি ইনপুট চিত্রের ডিফল্ট মান ফিরিয়ে দেয় এবং সংশোধন করে। |
অক্ষম | এটি একটি ইনপুট চিত্রের নিষ্ক্রিয় বৈশিষ্ট্যের মান ফিরিয়ে দেয় এবং পরিবর্তন করে। |
ফর্ম | এটি ফর্মের রেফারেন্স প্রদান করে যেটিতে HTML নথিতে ইনপুট চিত্র ক্ষেত্র রয়েছে৷ |
formAction | এটি একটি ইনপুট চিত্রের গঠন বৈশিষ্ট্যের মান ফিরিয়ে দেয় এবং পরিবর্তন করে। |
formEnctype | এটি একটি ইনপুট ইমেজের ফরমেন্সটাইপ অ্যাট্রিবিউটের মান ফিরিয়ে দেয় এবং পরিবর্তন করে। |
ফর্ম পদ্ধতি | এটি একটি ইনপুট ইমেজের ফর্মমেথড অ্যাট্রিবিউটের মান ফিরিয়ে দেয় এবং পরিবর্তন করে। |
formNoValidate | এটি ফিরে আসে এবং ফর্মের ডেটা জমা দেওয়ার সময় যাচাই করা উচিত কিনা তা সংশোধন করে৷ |
formTarget | এটি একটি ইনপুট ইমেজের ফর্মটার্গেট অ্যাট্রিবিউটের মান ফিরিয়ে দেয় এবং পরিবর্তন করে। |
উচ্চতা | এটি একটি ইনপুট চিত্রের উচ্চতা বৈশিষ্ট্যের মান ফিরিয়ে দেয় এবং পরিবর্তন করে। |
নাম | এটি একটি ইনপুট চিত্রের নামের বৈশিষ্ট্যের মান ফিরিয়ে দেয় এবং পরিবর্তন করে। |
Src | এটি একটি ইনপুট ইমেজের src অ্যাট্রিবিউটের মান ফিরিয়ে দেয় এবং পরিবর্তন করে। |
টাইপ | এটি একটি ইনপুট ইমেজের টাইপ অ্যাট্রিবিউটের মান প্রদান করে। |
মান | এটি একটি ইনপুট চিত্রের মান বৈশিষ্ট্যের বিষয়বস্তু ফিরিয়ে দেয় এবং পরিবর্তন করে। |
প্রস্থ | এটি একটি ইনপুট চিত্রের প্রস্থ বৈশিষ্ট্যের মান ফিরিয়ে দেয় এবং পরিবর্তন করে। |
উদাহরণ
ইনপুট ইমেজ অবজেক্ট -
এর একটি উদাহরণ দেখা যাক<!DOCTYPE html> <html> <head> <style> body{ text-align:center; background-color:#363946; color:#fff; } .btn{ background-color:#db133a; border:none; height:2rem; border-radius:50px; width:60%; margin:2rem auto; display:block; color:#fff; outline:none; cursor:pointer; } </style> </head> <body> <h1>DOM Input Image Object Example</h1> <button onclick="createIframe()" class="btn">Create an image submit button</button> <script> function createIframe() { var imageInput = document.createElement("INPUT"); imageInput.setAttribute("type", "image"); imageInput.setAttribute("src", "https://www.tutorialspoint.com/jdbc/images/jdbc-mini-logo.jpg"); document.body.appendChild(imageInput); } </script> </body> </html>
আউটপুট
এটি নিম্নলিখিত আউটপুট −
তৈরি করবে
“একটি ছবি জমা দিন বোতাম তৈরি করুন-এ ক্লিক করুন একটি ইনপুট ইমেজ অবজেক্ট তৈরি করতে ” বোতাম −