Как преобразовать HTML в обычный текст в Javascript

Одна из наиболее полезных вещей, которую вы можете делать с помощью языка сценариев JavaScript, — это манипулирование и работа с объектной моделью документа (или «DOM») HTML-документа. DOM документа HTML — это соглашение для представления содержимого этого документа. Он предоставляет возможность веб-браузерам и языкам сценариев, таким как JavaScript, взаимодействовать с различными элементами, составляющими этот документ. Используя JavaScript и DOM веб-страницы, вы можете легко преобразовать HTML в обычный текст.

Шаг 1

Добавьте объявление SCRIPT в раздел HEAD вашего HTML-документа. Тег SCRIPT определяет скрипт на стороне клиента, такой как JavaScript. В вашем теге SCRIPT для атрибута "type" должно быть установлено значение "text/javascript", чтобы все объявление SCRIPT читалось следующим образом:(где код JavaScript находится между двумя тегами).

Шаг 2

Определите функцию JavaScript, которая принимает одну строку в качестве параметра. Этот строковый параметр содержит HTML-код, который вы будете преобразовывать в обычный текст.

Шаг 3

Создайте временный элемент DIV внутри вашей функции JavaScript, используя метод createElement().

Шаг 4

Назначьте строковый параметр вашей функции атрибуту "innerHTML" вашего временного DIV.

Шаг 5

Создайте в своей функции временную строковую переменную.

Шаг 6

Возьмите обычный текстовый контент вашего временного DIV, используя его атрибуты «textContent» и «innerText», и назначьте его своей временной строковой переменной. Из-за проблем совместимости между браузерами и "textContent", и "innerText" будут определены в некоторых веб-браузерах и не определены в других, но один или другой будет определен во всех версиях всех основных браузеров.

Шаг 7

Верните значение, хранящееся в вашей временной строке, с помощью оператора «return». Это вернет значение обычного текста вашего преобразованного HTML.

Совет

Вместо того, чтобы использовать операторы IF-THEN для проверки кросс-браузерной совместимости и принятия решения о том, использовать ли «textContent» или «innerText» в вашей функции, просто присвойте обычное текстовое значение вашего временного элемента DIV вашей временной строковой переменной следующим образом:var tmpString =tmpDiv.textContent || tmpDiv.innerText.