खोज…


पैरामीटर

गुण विवरण
name आइफ्रेम के src को बदलने के लिए a टैग के साथ उपयोग किए जाने वाले तत्व का नाम सेट करता है।
width पिक्सेल में तत्व की चौड़ाई सेट करता है।
height पिक्सेल में तत्व की ऊँचाई सेट करता है।
src उस पृष्ठ को निर्दिष्ट करता है जिसे फ्रेम में प्रदर्शित किया जाएगा।
srcdoc उस सामग्री को निर्दिष्ट करता है जो फ्रेम में प्रदर्शित होगी, यह मानते हुए कि ब्राउज़र इसका समर्थन करता है। सामग्री मान्य HTML होनी चाहिए।
sandbox जब सेट किया जाता है, iframe की सामग्री को एक अद्वितीय मूल से माना जाता है और स्क्रिप्ट, प्लगइन्स, फ़ॉर्म और पॉपअप सहित सुविधाओं को अक्षम किया जाएगा। मूल्यों की एक अलग-अलग सूची को जोड़कर प्रतिबंधों को चुनिंदा रूप से आराम दिया जा सकता है। संभावित मानों के लिए रिमार्क्स में तालिका देखें।
allowfullscreen क्या iframe की सामग्री को requestFullscreen() का उपयोग करने की अनुमति दी requestFullscreen()

टिप्पणियों

एक iframe वर्तमान HTML दस्तावेज़ में किसी अन्य दस्तावेज़ को एम्बेड करने के लिए उपयोग किया जाता है।

आप प्रदर्शन के लिए iframes का उपयोग कर सकते हैं:

  • उसी डोमेन पर अन्य HTML पृष्ठ;
  • किसी अन्य डोमेन पर अन्य HTML पृष्ठ (नीचे देखें - समान-मूल नीति);
  • पीडीएफ दस्तावेज़ (हालांकि IE में कुछ समस्याएं हो सकती हैं, यह SO प्रश्न मदद कर सकता है);

आप एक अंतिम उपाय के रूप में एक iframe का उपयोग करते हैं, क्योंकि इसमें बुकमार्क और नेविगेशन की समस्याएँ हैं, और एक iframe के अलावा हमेशा बेहतर विकल्प होते हैं। इस SO प्रश्न से आपको iframes के उतार-चढ़ाव के बारे में अधिक समझने में मदद मिलेगी।


समान-मूल नीति

कुछ साइटों को एक iframe का उपयोग करके प्रदर्शित नहीं किया जा सकता है, क्योंकि वे समान-मूल नीति नामक नीति लागू करते हैं । इसका मतलब यह है कि जिस साइट पर आइफ्रेम निहित है वह उसी डोमेन पर होना चाहिए जो प्रदर्शित किया जाना है।

यह नीति उस छेड़छाड़ की सामग्री पर भी लागू होती है जो एक iFrame के अंदर रहती है। यदि iFrame किसी भिन्न डोमेन से सामग्री एक्सेस कर रहा है, तो आप iFrame के अंदर की सामग्री तक पहुँच या हेरफेर नहीं कर पाएंगे।

W3C पर iframe तत्व


sandbox विशेषता

sandbox विशेषता, जब सेट किया जाता है, iframe में अतिरिक्त प्रतिबंध जोड़ता है। इन प्रतिबंधों को शिथिल करने के लिए टोकन की एक अलग से सूची का उपयोग किया जा सकता है।

मूल्य विवरण
allow-forms प्रपत्र जमा करने की अनुमति देता है।
allow-pointer-lock जावास्क्रिप्ट पॉइंटर एपीआई को सक्षम करता है।
allow-popups पॉपअप window.open का उपयोग करके बनाया जा सकता है। इसे window.open या <a target="_blank"
allow-same-origin Iframe दस्तावेज़ को एक अद्वितीय दिए जाने के बजाय अपने वास्तविक मूल का उपयोग करता है। यदि allow-scripts के साथ इफ्रेम दस्तावेज़ का उपयोग किया जाता है, तो सभी सैंडबॉक्सिंग हटा सकते हैं यदि यह मूल दस्तावेज के समान मूल से हो।
allow-scripts स्क्रिप्ट्स को सक्षम करता है। Iframe दस्तावेज़ और मूल दस्तावेज़ postMessage() API का उपयोग करते हुए एक दूसरे के साथ संवाद करने में सक्षम हो सकते हैं। यदि allow-same-origin के साथ उपयोग किया जाता है, तो iframe दस्तावेज़ allow-same-origin सैंडपेपर के समान मूल से होने पर सभी सैंडबॉक्सिंग निकाल सकता है।
allow-top-navigation आइफ्रेम की सामग्री को शीर्ष स्तर के दस्तावेज़ के स्थान को बदलने की अनुमति देता है।

इनलाइन फ्रेम की मूल बातें

"IFrame" शब्द का अर्थ इनलाइन फ्रेम है। इसका उपयोग आपके पेज में किसी अन्य पेज को शामिल करने के लिए किया जा सकता है। यह एक छोटा सा फ्रेम जो की सटीक सामग्री से पता चलता निकलेगा base.html

<iframe src="base.html"></iframe>

फ़्रेम का आकार सेट करना

IFrame को width और height विशेषताओं का उपयोग करके आकार दिया जा सकता है, जहां पिक्सेल में मानों का प्रतिनिधित्व किया जाता है (HTML 4.01 अनुमत प्रतिशत मान, लेकिन HTML 5 केवल CSS पिक्सेल में मानों को अनुमति देता है)।

<iframe src="base.html" width="800" height="600"></iframe>

IFrames के साथ एंकर का उपयोग करना

आम तौर पर एक iframe के भीतर वेबपेज का परिवर्तन, iframe से शुरू किया जाता है, उदाहरण के लिए, Ifame के अंदर एक लिंक पर क्लिक करके। हालाँकि, IFrame के बाहर से एक IFrame की सामग्री को बदलना संभव है। आप एक एंकर टैग का उपयोग कर सकते हैं, जिसकी href विशेषता वांछित URL पर सेट है और जिसका target विशेषता iframe के name विशेषता पर सेट है।

<iframe src="webpage.html" name="myIframe"></iframe>
<a href="different_webpage.html" target="myIframe">Change the Iframe content to different_webpage.html</a>

"Srcdoc" विशेषता का उपयोग करना

पूरे HTML दस्तावेज़ के रूप में iframe की सटीक सामग्री को निर्दिष्ट करने के लिए srcdoc विशेषता ( src विशेषता के बजाय) का उपयोग किया जा सकता है। यह "IFrames are cool!" पाठ के साथ एक IFrame उत्पन्न करेगा।

<iframe srcdoc="<p>IFrames are cool!</p>"></iframe>

यदि srcdoc विशेषता ब्राउज़र द्वारा समर्थित नहीं है, तो IFrame इसके बजाय src विशेषता का उपयोग करने के लिए वापस आ जाएगा, लेकिन यदि src और srcdoc दोनों विशेषताएँ मौजूद हैं और ब्राउज़र द्वारा समर्थित हैं, तो srcdoc पूर्वता लेता है।

<iframe srcdoc="<p>Iframes are cool!</p>" src="base.html"></iframe>

उपरोक्त उदाहरण में, यदि ब्राउज़र srcdoc विशेषता का समर्थन नहीं करता है, तो यह इसके बजाय base.html पृष्ठ की सामग्री को प्रदर्शित करेगा।

सैंडबॉक्सिंग

निम्नलिखित सभी प्रतिबंधों के साथ एक अविश्वसनीय वेब पेज एम्बेड करता है

<iframe sandbox src="http://example.com/"></iframe>

पृष्ठ को स्क्रिप्ट चलाने और फ़ॉर्म सबमिट करने की अनुमति देने के लिए, sandbox attribute लिए allow-scripts और allow-forms जोड़ें।

<iframe sandbox="allow-scripts allow-forms" src="http://example.com/"></iframe>

यदि मूल डोमेन पेज के समान डोमेन पर अविश्वसनीय सामग्री (जैसे उपयोगकर्ता टिप्पणियां) हैं, तो स्क्रिप्ट को अक्षम करने के लिए एक iframe का उपयोग किया जा सकता है, जबकि अभी भी मूल दस्तावेज़ को जावास्क्रिप्ट का उपयोग करके सामग्री के साथ बातचीत करने की अनुमति मिलती है।

<iframe sandbox="allow-same-origin allow-top-navigation" src="http://example.com/untrusted/comments/page2">

मूल दस्तावेज़ ईवेंट श्रोताओं को जोड़ सकते हैं और अपनी सामग्री को फिट करने के लिए IFrame का आकार बदल सकते हैं। यह, allow-top-navigation , सैंडबॉक्स किए गए iframe को मूल दस्तावेज़ का हिस्सा बना सकता है।

यह सैंडबॉक्स सैनिटाइजिंग इनपुट के लिए एक प्रतिस्थापन नहीं है, लेकिन गहराई रणनीति में एक रक्षा के हिस्से के रूप में इस्तेमाल किया जा सकता है।

यह भी ध्यान रखें कि इस सैंडबॉक्स को किसी हमलावर द्वारा किसी उपयोगकर्ता को सीधे iframe के स्रोत पर जाने के लिए समझा जा सकता है। इस हमले को कम करने के लिए सामग्री सुरक्षा नीति HTTP हेडर का उपयोग किया जा सकता है।



Modified text is an extract of the original Stack Overflow Documentation
के तहत लाइसेंस प्राप्त है CC BY-SA 3.0
से संबद्ध नहीं है Stack Overflow