jQuery - तत्व जोड़ें
JQuery के साथ, नए तत्व/सामग्री जोड़ना आसान है।
नई HTML सामग्री जोड़ें
हम नई सामग्री जोड़ने के लिए उपयोग की जाने वाली चार jQuery विधियों को देखेंगे:
append()- चयनित तत्वों के अंत में सामग्री सम्मिलित करता हैprepend()- चयनित तत्वों की शुरुआत में सामग्री सम्मिलित करता हैafter()- चयनित तत्वों के बाद सामग्री सम्मिलित करता हैbefore()- चयनित तत्वों से पहले सामग्री सम्मिलित करता है
jQuery एपेंड () विधि
JQuery append()विधि चयनित HTML तत्वों के अंत में सामग्री सम्मिलित करती है।
उदाहरण
$("p").append("Some appended text.");
jQuery प्रीपेन्ड () विधि
JQuery prepend()विधि चयनित HTML तत्वों की शुरुआत में सामग्री सम्मिलित करती है।
उदाहरण
$("p").prepend("Some prepended text.");
एपेंड () और प्रीपेन्ड () के साथ कई नए तत्व जोड़ें
उपरोक्त दोनों उदाहरणों में, हमने चयनित HTML तत्वों के आरंभ/अंत में केवल कुछ पाठ/HTML सम्मिलित किए हैं।
हालाँकि, दोनों append()और prepend()विधियाँ पैरामीटर के रूप में अनंत संख्या में नए तत्व ले सकती हैं। नए तत्वों को टेक्स्ट/एचटीएमएल (जैसे हमने ऊपर के उदाहरणों में किया है), jQuery के साथ, या जावास्क्रिप्ट कोड और डोम तत्वों के साथ उत्पन्न किया जा सकता है।
निम्नलिखित उदाहरण में, हम कई नए तत्व बनाते हैं। तत्व टेक्स्ट/एचटीएमएल, jQuery, और जावास्क्रिप्ट/डोम के साथ बनाए जाते हैं। append()फिर हम नए तत्वों को विधि
के साथ पाठ में जोड़ते हैं (यह भी काम करता prepend()है):
उदाहरण
function appendText()
{
var txt1 = "<p>Text.</p>";
// Create element with HTML
var txt2 = $("<p></p>").text("Text."); // Create with jQuery
var txt3 = document.createElement("p"); // Create with DOM
txt3.innerHTML = "Text.";
$("body").append(txt1, txt2, txt3); // Append the new elements
}
jQuery के बाद () और पहले () तरीके
jQuery after()विधि चयनित HTML तत्वों के बाद सामग्री सम्मिलित करती है।
JQuery before()विधि चयनित HTML तत्वों से पहले सामग्री सम्मिलित करती है।
उदाहरण
$("img").after("Some text after");
$("img").before("Some text before");
बाद () और पहले () के साथ कई नए तत्व जोड़ें
साथ ही, दोनों after()और before()विधियां पैरामीटर के रूप में अनंत संख्या में नए तत्व ले सकती हैं। नए तत्वों को टेक्स्ट/एचटीएमएल (जैसे हमने ऊपर के उदाहरण में किया है), jQuery के साथ, या जावास्क्रिप्ट कोड और डोम तत्वों के साथ उत्पन्न किया जा सकता है।
निम्नलिखित उदाहरण में, हम कई नए तत्व बनाते हैं। तत्व टेक्स्ट/एचटीएमएल, jQuery, और जावास्क्रिप्ट/डोम के साथ बनाए जाते हैं। after()फिर हम विधि
के साथ पाठ में नए तत्व सम्मिलित करते हैं (यह भी काम करता before()है):
उदाहरण
function afterText()
{
var txt1 = "<b>I </b>";
// Create element with HTML
var txt2 = $("<i></i>").text("love "); // Create with jQuery
var txt3 = document.createElement("b"); // Create with DOM
txt3.innerHTML = "jQuery!";
$("img").after(txt1, txt2, txt3);
// Insert new elements after <img>
}
jQuery व्यायाम
jQuery एचटीएमएल संदर्भ
सभी jQuery HTML विधियों के संपूर्ण अवलोकन के लिए, कृपया हमारे jQuery HTML/CSS संदर्भ पर जाएँ ।