Атрибут spellcheck тега <summary>


Описание

Атрибут spellcheck определяет, должна ли проверяться орфография текста внутри элемента <summary> при его редактировании. Работает только в сочетании с атрибутом contenteditable.

Пример использования:
<details> <summary contenteditable="true" spellcheck="true">Редактируемый заголовок с проверкой орфографии</summary> <p>Содержимое блока...</p> </details>

Значения атрибута:

Значение Описание Когда использовать
true Включить проверку орфографии Для редактируемых текстовых элементов
false Отключить проверку орфографии Для элементов с кодом, именами собственными

Особенности работы:

  • Требует наличия атрибута contenteditable="true"
  • Использует словарь браузера (зависит от настроек языка)
  • Работает только в поддерживающих браузерах
  • Не влияет на нередактируемые элементы

Пример с разными языками:

<details> <summary contenteditable="true" spellcheck="true" lang="en">Editable english text</summary> <p>English content</p> </details> <details> <summary contenteditable="true" spellcheck="true" lang="ru">Редактируемый русский текст</summary> <p>Содержимое на русском</p> </details>

Рекомендации:

  • Всегда указывайте атрибут lang для правильной проверки
  • Отключайте проверку для элементов с кодом или специальными терминами
  • Используйте вместе с CSS для визуального выделения редактируемых областей
  • Тестируйте в разных браузерах

Ограничения:

  • Поддержка зависит от браузера и его настроек
  • Не работает одинаково на всех платформах
  • Не заменяет профессиональные системы проверки орфографии
  • Может некорректно работать со смешанными языками

Пример с отключенной проверкой:

<details> <summary contenteditable="true" spellcheck="false">var x = 10; // Код не проверяется</summary> <pre>Пример кода...</pre> </details>

Примечание: Для сложных сценариев редактирования текста рассмотрите использование специализированных библиотек вроде TinyMCE или CKEditor.