insertAdjacentElement विधि
insertAdjacentElement विधि
पृष्ठ पर किसी भी स्थान पर एक तत्व डालने की अनुमति देती है।
यह अक्सर createElement के साथ एक तत्व बनाने के बाद उपयोग की जाती है।
कोड को संदर्भ तत्व के सापेक्ष डाला जाता है।
आप संदर्भ तत्व के पहले डाल सकते हैं
(डालने की विधि beforeBegin),
उसके बाद (डालने की विधि afterEnd),
और संदर्भ त元素的 की शुरुआत में (डालने की विधि afterBegin)
या अंत में (डालने की विधि beforeEnd) भी डाल सकते हैं।
वाक्य - विन्यास
संदर्भ तत्व.insertAdjacentElement(डालने की विधि, डालने के लिए कोड);
उदाहरण . विधि beforeBegin
मान लें कि संदर्भ तत्व #target है।
आइए इसके पहले एक नया पैराग्राफ डालें:
<div id="target">
<p>elem</p>
</div>
let p = document.createElement('p');
p.textContent = '!';
let target = document.querySelector('#target');
target.insertAdjacentElement('beforeBegin', p);
कोड निष्पादित करने का परिणाम:
<p>!</p>
<div id="target">
<p>elem</p>
</div>
उदाहरण . विधि afterEnd
और अब संदर्भ तत्व के बाद एक नया पैराग्राफ डालें:
<div id="target">
<p>elem</p>
</div>
let p = document.createElement('p');
p.textContent = '!';
let target = document.querySelector('#target');
target.insertAdjacentElement('afterEnd', p);
कोड निष्पादित करने का परिणाम:
<div id="target">
<p>elem</p>
</div>
<p>!</p>
उदाहरण . विधि afterBegin
संदर्भ तत्व की शुरुआत में एक नया पैराग्राफ डालें:
<div id="target">
<p>elem</p>
</div>
let p = document.createElement('p');
p.textContent = '!';
let target = document.querySelector('#target');
target.insertAdjacentElement('afterBegin', p);
कोड निष्पादित करने का परिणाम:
<div id="target">
<p>!</p>
<p>elem</p>
</div>
उदाहरण . विधि beforeEnd
संदर्भ तत्व के अंत में एक नया पैराग्राफ डालें:
<div id="target">
<p>elem</p>
</div>
let p = document.createElement('p');
p.textContent = '!';
let target = document.querySelector('#target');
target.insertAdjacentElement('beforeEnd', p);
कोड निष्पादित करने का परिणाम:
<div id="target">
<p>elem</p>
<p>!</p>
</div>
यह भी देखें
-
insertAdjacentHTMLविधि,
जो टैग को निर्दिष्ट स्थान पर डालती है -
insertAdjacentTextविधि,
जो टेक्स्ट को निर्दिष्ट स्थान पर डालती है -
prependविधि,
जो तत्वों को शुरुआत में डालती है -
appendविधि,
जो तत्वों को अंत में डालती है -
appendChildविधि,
जो तत्वों को पैरेंट के अंत में डालती है -
insertBeforeविधि,
जो तत्वों को किसी तत्व से पहले डालती है
