Обратите внимание, что Element::innerText
свойство не будет содержать текст, который был скрыт стилем CSS " display:none
" в Google Chrome (также оно будет отбрасывать контент, маскированный другой техникой CSS (включая размер шрифта: 0, цвет: прозрачный и несколько других подобных эффектов, которые делают текст не видимым).
Другие свойства CSS также учитываются:
- Сначала анализируется стиль «display:» внутренних элементов, чтобы определить, разделяет ли он содержимое блока (например, «display: block», который является значением по умолчанию для элементов блока HTML во встроенной таблице стилей браузера, и поведение которого не было переопределено ваш собственный стиль CSS); в этом случае новая строка будет вставлена в значение свойства innerText. Это не произойдет со свойством textContent.
- Также будут учитываться свойства CSS, которые генерируют встроенное содержимое: например, встроенный элемент,
<br \>
который генерирует встроенную новую строку, также будет генерировать новую строку в значении innerText.
- Стиль «display: inline» не вызывает новой строки ни в textContent, ни в innerText.
- Стиль «display: table» генерирует новые строки вокруг таблицы и между строками таблицы, но «display: table-cell» генерирует символ табуляции.
- Свойство position: absolute (используется с display: block или display: inline, это не имеет значения) также приведет к вставке разрыва строки.
- Некоторые браузеры также включают разделение пробелов одним пробелом
Но Element::textContent
все равно будет содержать ВСЕ содержимое внутренних текстовых элементов независимо от применяемого CSS, даже если они невидимы. И никакие дополнительные символы новой строки или пробелы не будут генерироваться в textContent, который просто игнорирует все стили и структуру, а также встроенные / блочные или позиционированные типы внутренних элементов.
Операция копирования / вставки с использованием выделения мышью отбрасывает скрытый текст в формате обычного текста, который помещается в буфер обмена, поэтому он не будет содержать все в textContent
, а только то, что находится внутри innerText
(после генерации пробелов / перехода на новую строку, как указано выше) ,
Оба свойства затем поддерживаются в Google Chrome, но их содержание может отличаться. Старые браузеры по-прежнему включали в innetText все, что сейчас содержит textContent (но их поведение в связи с последующим генерированием пробелов / новых строк было несовместимым).
jQuery разрешит эти несоответствия между браузерами, используя метод ".text ()", добавленный к проанализированным элементам, которые он возвращает с помощью запроса $ (). Внутренне это решает трудности, просматривая HTML DOM, работая только с уровнем «узла». Таким образом, он вернет что-то похожее на стандартный textContent.
Предостережение заключается в том, что этот метод jQuery не будет вставлять лишние пробелы или разрывы строк, которые могут быть видны на экране, вызванные подэлементами (например <br />
) содержимого.
Если вы разрабатываете некоторые сценарии для обеспечения доступности, и ваша таблица стилей анализируется для неауристического рендеринга, например, плагинов, используемых для связи со средством чтения Брайля, этот инструмент должен использовать textContent, если он должен включать конкретные знаки пунктуации, которые добавляются в промежутки, стилизованные с помощью «display: none» и обычно включаются в страницы (например, для верхних индексов / подписок), в противном случае innerText будет очень запутанным для читателя Брайля.
Тексты, скрытые с помощью хитростей CSS, теперь обычно игнорируются основными поисковыми системами (которые также анализируют CSS ваших HTML-страниц, а также игнорируют тексты, не имеющие контрастных цветов на фоне), используя анализатор HTML / CSS и свойство DOM «innerText» точно так же, как в современных визуальных браузерах (по крайней мере, это невидимое содержимое не будет проиндексировано, поэтому скрытый текст не может быть использован в качестве трюка для принудительного включения некоторых ключевых слов на странице для проверки ее содержимого); но этот скрытый текст будет по-прежнему отображаться на странице результатов (если страница все еще была определена из индекса для включения в результаты), используя свойство textContent вместо полного HTML для удаления дополнительных стилей и сценариев.
Если вы назначите какой-либо простой текст в любом из этих двух свойств, это перезапишет внутреннюю разметку и примененные к ней стили (только назначенный элемент сохранит свой тип, атрибуты и стили), поэтому оба свойства будут содержать одинаковое содержимое. , Однако некоторые браузеры теперь больше не поддерживают запись в innerText и позволяют перезаписывать только свойство textContent (вы не можете вставлять разметку HTML при записи в эти свойства, поскольку специальные символы HTML будут правильно кодироваться с использованием числовых ссылок на символы, которые будут отображаться буквально. , если вы затем прочитаете innerHTML
свойство после присвоения innerText
или textContent
.