Замена html содержимого внутри элемента

Метод: .html(string);

• Задача 1:

  - изменить текстовое содержимое всех пунктов в списке на html конструкцию <span>измененный текст</span>.

  Показать решение

  • Решение:

    $(function () {
    	$('li').text('<span>измененный текст</span>');
    });
    

    Пояснение:

    - Для решения задачи с помощью селектора $('li') выберем все пункты списка. С помощью метода .text('<span>измененный текст</span>'); изменяем текстовое содержимое отобранных элементов на html конструкцию <span>измененный текст<. Следует учитывать, что если внутри элемента li содержаться дочерние элементы, то они будут затерты.

    Результат:

    При загрузке страницы, к которой подключен скрипт, содержимое внутри пунктов списка поменяется на html конструкцию <span>измененный текст<.

• Задача 2:

  - изменить текстовое содержимое последнего пункта в списке на html конструкцию <span>измененный текст</span>.

  Показать решение

  • Решение:

    $(function () {
    	$('li:last').text('<span>измененный текст</span>');
    });
    

    Пояснение:

    - Для решения задачи с помощью селектора $('li:last') выберем последний элемент списка. С помощью метода .text('<span>измененный текст</span>') изменяем текстовое содержимое отобранного элемента. Следует учитывать, что если внутри элемента li содердаться дочерние элементы, то они будут затерты.

    Результат:

    При загрузке страницы, к которой подключен скрипт, текстовое содержимое последнего пункта списка поменяется на html конструкцию <span>измененный текст<.