Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> HTML

HTML DOM इनपुट फाइल अपलोड ऑब्जेक्ट

परिचय

HTML DOM इनपुट फाइल अपलोड ऑब्जेक्ट HTML दस्तावेज़ में type="file" वाले <input> एलिमेंट को दर्शाता है।

सिंटैक्स - फाइल अपलोड ऑब्जेक्ट बनाना

var fileUploadBtn = document.createElement("INPUT");
fileUploadBtn.setAttribute("type", "file");

प्रॉपर्टीज़

प्रॉपर्टीव्याख्या
acceptफाइल अपलोड बटन के accept एट्रिब्यूट का मान प्राप्त/सेट करता है।
autofocusपेज लोड पर फाइल अपलोड बटन को ऑटोफोकस करना चाहिए या नहीं, यह प्राप्त/सेट करता है।
disabledफाइल अपलोड बटन के disabled एट्रिब्यूट का मान प्राप्त/सेट करता है।
defaultValueफाइल अपलोड बटन का डिफ़ॉल्ट मान प्राप्त/सेट करता है।
filesचुनी गई सभी फाइलों को दर्शाने वाला FileList ऑब्जेक्ट लौटाता है।
formफाइल अपलोड इनपुट को घेरने वाले फॉर्म का रेफरेंस लौटाता है।
multipleएकाधिक फाइल चयन की अनुमति है या नहीं, यह प्राप्त/सेट करता है।
nameफाइल अपलोड बटन के name एट्रिब्यूट का मान प्राप्त/सेट करता है।
requiredफाइल अपलोड बटन के required एट्रिब्यूट का मान प्राप्त/सेट करता है।
typeफाइल अपलोड बटन के type एट्रिब्यूट का मान प्राप्त/सेट करता है।
valueफाइल अपलोड बटन के value एट्रिब्यूट का मान प्राप्त/सेट करता है।

उदाहरण

बटन पर क्लिक करके डायनामिकली फाइल अपलोड बटन बनाना:

<!DOCTYPE html>
<html>
<head>
<style>
  body { text-align: center; }
  .btn {
    background-color: lightblue;
    border: none;
    height: 2rem;
    border-radius: 50px;
    width: 60%;
    margin: 1rem auto;
    display: block;
  }
</style>
</head>
<body>
<h1>DOM फाइल अपलोड ऑब्जेक्ट उदाहरण</h1>
<button onclick="createFileBtn()" class="btn">फाइल अपलोड बटन बनाएं</button>
<script>
  function createFileBtn() {
    var fileUploadBtn = document.createElement("INPUT");
    fileUploadBtn.setAttribute("type", "file");
    document.body.appendChild(fileUploadBtn);
  }
</script>
</body>
</html>

आउटपुट

"फाइल अपलोड बटन बनाएं" बटन पर क्लिक करने पर एक नया फाइल चयन इनपुट पेज में जुड़ जाएगा।

  1. HTML DOM S ऑब्जेक्ट HTML DOM S ऑब्जेक्ट

    HTML DOM S ऑब्जेक्ट HTML दस्तावेज़ के <s> तत्व को दर्शाता है। आइए एक s ऑब्जेक्ट बनाएं: वाक्य रचना (Syntax) निम्नलिखित वाक्य रचना है: document.createElement(S); उदाहरण आइए s ऑब्जेक्ट का एक उदाहरण देखें: <!DOCTYPE html> <html> <head> <style> body{ text-

  1. HTML DOM Input FileUpload autofocus प्रॉपर्टी HTML DOM Input FileUpload autofocus प्रॉपर्टी

    HTML DOM Input FileUpload autofocus प्रॉपर्टी सेट/लौटाती है कि पेज लोड होने पर इनपुट फाइल अपलोड ऑटोफोकस होगा या नहीं। सिंटैक्स निम्नलिखित सिंटैक्स है: बूलियन मान प्राप्त करना - true/false inputFileUploadObject.autofocus autofocus को booleanValue पर सेट करना inputFileUploadObject.autofocus = bool

  1. HTML DOM Input Reset ऑब्जेक्ट HTML DOM Input Reset ऑब्जेक्ट

    HTML DOM Input Reset ऑब्जेक्ट type reset वाले <input> एलिमेंट से जुड़ा होता है। हम createElement() और getElementById() मेथड का उपयोग करके क्रमशः type reset वाले इनपुट एलिमेंट को बना और एक्सेस कर सकते हैं। प्रॉपर्टीज Input reset ऑब्जेक्ट के लिए निम्नलिखित प्रॉपर्टीज हैं: प्रॉपर्टीविवरण aut