Примеры кодов замены контента

Здесь собраны простые примеры изменений контента с помощью JS. По аналогии вы сможете написать код для внедрения изменений в контент вашего сайта согласно вашей гипотезе и запустить A/B тест.

Пример 1. Замена цвета кнопки

Кнопка

$('.btn-color').css({
 'background-color':'green', 
 'border-color':'green'
});

выполнить код, отменить изменение

Пример 2. Замена текста кнопки

Старый текст

$('.btn-text').text('Новый текст');

выполнить код, отменить изменение

Пример 3. Увеличение размера кнопки

Кнопка

$('.btn-size').css({
 'font-size':'24px',
 'padding': '12px 24px'
});

выполнить код, отменить изменение

Пример 4. Изменение цвета фона страницы

$('body').css({
 'background-color':'#dfefff'
});

выполнить код, отменить изменение

Пример 5. Изменение шрифтов

$('body').css({
 'font-family':'serif'
});

выполнить код, отменить изменение

Пример 6. Добавление нового блока на страницу

//Вставляем блок с классом new-element после блока с классом add-new
$('.add-new').after('<div class="new-element" style="color:red;"></div>');

//добавляем HTML-содержимое в новый элемент
$('new-element').html('При заказе сегодня доставка <b>бесплатно</b>!');

выполнить код, отменить изменение

Пример 7. Удаление некоторых элементов со страницы, замена цвета всех кнопок, замена фона

//прячем все чётные элементы с классом runcode
$('.runcode').filter( ':even' ).hide();

//меняем цвет всех кнопок
$('button').css({
 'background-color':'green',
 'border-color':'green',
 'color':'white'
});

//меняем фон страницы
$('body').css({
 'background-color':'#d7ffb7'
});

выполнить код, отменить изменение

Примечание о jQuery

Для работы примеров из этой статьи на вашем сайте должна быть установлена библиотека jQuery.