Anchor download प्रॉपर्टी
download प्रॉपर्टी लिंक (<a>) के download एट्रिब्यूट का मान सेट या लौटाती है। यह निर्दिष्ट करता है कि लिंक किया गया संसाधन डाउनलोड होना चाहिए (नेविगेट नहीं) और डाउनलोड की गई फाइल का सुझाया गया नाम क्या हो।
सिंटैक्स
// सेट करें anchorObject.download = "filename" // प्राप्त करें anchorObject.download
उदाहरण: इमेज डाउनलोड लिंक
<!DOCTYPE html>
<html>
<body>
<h2>ReactJS</h2>
<a id="myLink" href="https://www.tutorialspoint.com/images/reactjs.png"
download="Learn ReactJS">
<img src="https://www.tutorialspoint.com/images/reactjs.png"
alt="ReactJS" width="200" height="200">
</a>
<button onclick="showDownload()">डाउनलोड मान प्रदर्शित करें</button>
<p id="result"></p>
<script>
function showDownload() {
var val = document.getElementById("myLink").download;
document.getElementById("result").innerHTML = "डाउनलोड नाम: " + val;
}
</script>
</body>
</html>
आउटपुट
बटन क्लिक करने पर: डाउनलोड नाम: Learn ReactJS
लिंक/इमेज पर क्लिक करने पर फाइल "Learn ReactJS.png" के रूप में डाउनलोड होगी (एक्सटेंशन स्वतः जुड़ता है)।
व्यवहार
downloadमान के साथ एक्सटेंशन स्वतः जोड़ा जाता है (सर्वर के Content-Type/Content-Disposition से)- यदि
downloadबिना मान के है (download=""), मूल फाइलनाम उपयोग होता है - क्रॉस-ओरिजिन लिंक्स पर काम नहीं करता (सुरक्षा प्रतिबंध)
- ब्राउज़र सेटिंग्स/उपयोगकर्ता पुष्टि डाउनलोड को ओवरराइड कर सकती है
उपयोग के मामले
- जनरेट की गई फाइल्स डाउनलोड (Canvas to PNG, JSON export)
- PDF रिपोर्ट्स, स्प्रेडशीट्स
- उपयोगकर्ता-अनुकूल फाइलनाम देना (UUID के बजाय)
- क्लाइंट-साइड फाइल जनरेशन (Blob + createObjectURL)
JavaScript से डायनामिक डाउनलोड
// Blob से फाइल बनाएं और डाउनलोड ट्रिगर करें
var blob = new Blob(["डेटा"], {type: "text/plain"});
var url = URL.createObjectURL(blob);
var a = document.createElement("a");
a.href = url;
a.download = "filename.txt";
a.click();
URL.revokeObjectURL(url);
