jQuery qo‘shish (add)
jQuery yordamida yangi elementlar/kontent qo‘shish oson.
Yangi HTML kontent qo‘shish
Yangi kontent qo‘shish uchun ishlatiladigan to‘rtta jQuery metodini ko‘rib chiqamiz:
append()- Tanlangan elementlarning oxiriga kontent qo‘shadiprepend()- Tanlangan elementlarning boshiga kontent qo‘shadiafter()- Tanlangan elementlardan keyin kontent qo‘shadibefore()- Tanlangan elementlardan oldin kontent qo‘shadi
jQuery append() metodi
jQuery append() metodi tanlangan HTML elementlarning OXIRIGA kontent qo‘shadi.
jQuery prepend() metodi
jQuery prepend() metodi tanlangan HTML elementlarning BOSHIGA kontent qo‘shadi.
append() va prepend() yordamida bir nechta yangi element qo‘shish
Yuqoridagi ikkala misolda biz tanlangan HTML elementlarning faqat boshiga/oxiriga biroz matn/HTML qo‘shdik.
Biroq append() va prepend() metodlarining har ikkalasi ham parametr sifatida istalgancha yangi elementni qabul qila oladi. Yangi elementlarni matn/HTML yordamida (yuqoridagi misollarda qilganimizdek), jQuery yordamida yoki JavaScript kodi va DOM elementlari yordamida yaratish mumkin.
Quyidagi misolda bir nechta yangi element yaratamiz. Elementlar matn/HTML, jQuery va JavaScript/DOM yordamida yaratiladi. So‘ngra yangi elementlarni append() metodi yordamida matnga qo‘shamiz (bu prepend() bilan ham ishlagan bo‘lardi):
Misol
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
}
O‘zingiz sinab ko‘ring »
jQuery after() va before() metodlari
jQuery after() metodi tanlangan HTML elementlardan KEYIN kontent qo‘shadi.
jQuery before() metodi tanlangan HTML elementlardan OLDIN kontent qo‘shadi.
Misol
$("img").after("Some text after");
$("img").before("Some text before");
O‘zingiz sinab ko‘ring »
after() va before() yordamida bir nechta yangi element qo‘shish
Shuningdek, after() va before() metodlarining har ikkalasi ham parametr sifatida istalgancha yangi elementni qabul qila oladi. Yangi elementlarni matn/HTML yordamida (yuqoridagi misolda qilganimizdek), jQuery yordamida yoki JavaScript kodi va DOM elementlari yordamida yaratish mumkin.
Quyidagi misolda bir nechta yangi element yaratamiz. Elementlar matn/HTML, jQuery va JavaScript/DOM yordamida yaratiladi. So‘ngra yangi elementlarni after() metodi yordamida matnga joylashtiramiz (bu before() bilan ham ishlagan bo‘lardi):
Misol
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>
}
O‘zingiz sinab ko‘ring »
jQuery mashqlari
jQuery HTML ma’lumotnomasi
Barcha jQuery HTML metodlari bo‘yicha to‘liq ma’lumot uchun jQuery HTML/CSS ma’lumotnomasiga o‘ting.
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!