Удаление HTML-тегов из строки: методы и регулярные выражения

Быстрый ответ

Если вам требуется быстро и лаконично очистить текст от ненужных HTML-тегов, присмотритесь к DOMParser:

const stripHTML = html => (new DOMParser().parseFromString(html, 'text/html')).body.textContent || "";
const result = stripHTML("<div>Пример <b>текста</b></div>");

С помощью этого кода вы получите чистый текст: "Пример текста". Просто и эффективно!

DOMParser отлично подходит для удаления HTML на клиентской стороне и поддерживается всеми современными браузерами, обеспечивая сохранность вашего текста.

Погружение в мир Swift

Если вы разрабатываете приложения для iOS на Swift, вам понадобится другой инструмент. Используйте следующее расширение String, которое применяет NSRegularExpression:

extension String {
    var htmlStripped: String {
        let pattern = "<.*?>"
        guard let regex = try? NSRegularExpression(pattern: pattern, options: []) else { return self }
        let range = NSRange(location: 0, length: utf16.count)
        return regex.stringByReplacingMatches(in: self, options: [], range: range, withTemplate: "")
    }
}

Использование расширения простое:

let html = "<div>Пример <b>текста</b></div>"
let stripped = html.htmlStripped // "Пример текста"

Регулярные выражения позволят вам главным образом избавиться от HTML-тегов, но не забывайте проверять их регулярно, чтобы избежать нежелательных последствий.

Визуализация

Поясним процесс удаления HTML-тегов на примере приведения в порядок ящика с носками:

Ваш текст — это ящик, полный носков (текста), среди которых валяются бумажки (HTML-теги).

🧦🧦🧦🧾🧦🧦🧦 -> Ваша задача – избавиться от бумажек (🧾), чтобы порядок в ящике был идеальным.

Продемонстрируем работу инструмента BeautifulSoup для ОС Python:

# Представляем вам ценный инструмент – BeautifulSoup:
from bs4 import BeautifulSoup

# Он словно магнит – притягивает к себе бумажки! 🧲
soup = BeautifulSoup(html_string)
text = soup.get_text()  // Вот и они – только носки!

// Обратите внимание, как аккуратно теперь лежат носки:
🧦🧦🧦🧦🧦

BeautifulSoup на Python умеет приводить содержимое в порядок, отлично справляется с работой с HTML-тегами.

Regex 101: на что обратить внимание

Регулярные выражения, пусть и очень могущественны, могут создавать проблемы при неправильном использовании:

• Старайтесь избегать "жадных" паттернов, они могут съесть больше, чем нужно.
• Выражения типа "<.*?>" могут ошибиться при встрече со вложенными тегами или комментариями.
• HTML из-за своей сложности бывает тяжело парсить с использованием регулярных выражений.

Удаление сложного HTML: вызов принят!

Когда вы столкнулись со сложностью HTML-тегов, вы можете использовать следующее расширение Swift:

extension String {
    func strippingHTML() -> String {
        guard let data = data(using: .utf8) else { return self }
        let options: [NSAttributedString.DocumentReadingOptionKey : Any] = [
            .documentType: NSAttributedString.DocumentType.html,
            .characterEncoding: String.Encoding.utf8.rawValue
        ]
        return (try? NSAttributedString(data: data, options: options, documentAttributes: nil))?.string ?? self
    }
}

Будьте готовы к нестандартным ситуациям

Среди HTML-тегов могут возникнуть исключения:

• Теги скриптов и стилей: их содержимое не должно влиять на результат обработки.
• Комментарии и CDATA: их сложно отличить от текста с помощью регулярных выражений, лучше применять парсеры.
• Некорректные теги: они могут сбивать регулярные выражения с толку, в подобных случаях снова на помощь придут парсеры.

Не забывайте о производительности

Регулярные выражения требуют ресурсов, поэтому если важна производительность:

• Анализируйте работу регулярных выражений на текстах разной длины и структуры.
• Проводите тестирование на мобильных устройствах, если разрабатываете приложение.
• Рассмотрите использование встроенных парсеров для оптимизации производительности.

Полезные материалы

1. HTMLElement: свойство innerText – Web API | MDN — Руководство по свойству innerText, помогающему работать с текстом без HTML.
2. Удаление HTML-тегов из текста с использованием JavaScript – Stack Overflow — Советы и примеры по очистке текста от HTML с помощью JavaScript.
3. JavaScript String replace() Method — Подробное руководство по методу replace() в JavaScript для удаления HTML-тегов.
4. regex101: создайте, тестируйте и отладьте regex — Инструмент для создания и тестирования регулярных выражений.
5. GitHub – mathiasbynens/he: Надежный HTML-кодировщик/декодировщик на JavaScript — Библиотека для работы с HTML-сущностями на JavaScript.
6. HTML Sanitizer API — API от W3C для обеспечения защиты от XSS-атак.