Заміна блоків контентом, очищення елементів, видалення, клонування елементів
.replaceAll('селектор') - вставить попередньо вказаний код замість вказаних елементів
.replaceWith('content') - міняє вибрані елементи на вказаний контент
.empty() - видаляє весь вміст вибраного елементу і робить його пустим
.remove() - видаляє вибрані елементи
.clone() - клонує (робить копії) вибраних раніше елементів
.clone(умова) - умова: true або false робить клони активними (true) для подій, які вже прописані для оригіналів або пасивними (false) для цих подій
Приклади
.replaceAll('селектор')Вставить попередньо вказаний код замість вказаних елементів
Це aбзац №1 в блоці з id="ra"
Це aбзац №2 в блоці з id="ra"
$('#btn1').click (function(){ $('<h4>Заміна абзаців</h4>').replaceAll('#ra p'); });
.replaceWith('content')
Замінить вибрані елементи на вказаний контент
Це aбзац №1 в блоці з id="ra"
Це aбзац №2 в блоці з id="ra"
$('#btn2').click (function(){ $('#ra p').replaceWith('<h4>Заміна абзаців</h4>'); });
.empty()
Видаляє весь вміст вибраного елементу і робить його пустим
Це aбзац №1 в блоці з id="re"
Це aбзац №2 в блоці з id="re"
$('#btn3').click (function(){ $('#re').empty(); });
.remove()
Видаляє вибрані елементи
Це aбзац №1 в блоці з id="rr"
Це aбзац №2 в блоці з id="rr"
$('#btn4').click (function(){ $('#rr p').eq(0).remove(); });
.clone()
Клонує (робить копії) вибраних раніше елементів
Клікайте по spanУмова: true або false робить клони активними (true) для подій, які вже прописані для оригіналів або пасивними (false) для цих подій.
Пусті дужки - також означає false. В прикладі стоїть true, отже клік зберігся і для клонів.
$('#rc span').click (function(){ /* клонуємо span і вставляємо його в блок*/ $(this).clone(true).appendTo('#rc'); });
далі ✏