Свойство внутреннего текста HTML DOM
Пример
Получить внутренний текст элемента:
var x =
document.getElementById("myBtn").innerText;
Другие примеры «Попробуйте сами» ниже.
Определение и использование
Свойство innerText задает или возвращает текстовое содержимое указанного узла и всех его потомков .
Если вы установите свойство innerText, все дочерние узлы будут удалены и заменены одним узлом Text, содержащим указанную строку.
Примечание. Это свойство аналогично свойству textContent , однако есть некоторые отличия.
- textContent возвращает текстовое содержимое всех элементов, а innerText возвращает содержимое всех элементов, кроме элементов <script> и <style>.
- innerText не будет возвращать текст элементов, которые скрыты с помощью CSS (текстовый контент будет).
Совет: Чтобы установить или вернуть HTML-содержимое элемента, используйте свойство innerHTML .
Поддержка браузера
Цифры в таблице указывают на первую версию браузера, которая полностью поддерживает это свойство.
| Property | |||||
|---|---|---|---|---|---|
| innerText | 4.0 | 10.0 | 45.0 | 3.0 | 9.6 |
Синтаксис
Вернуть текстовое содержимое узла:
node.innerText
Установите текстовое содержимое узла:
node.innerText = text
Значения свойств
| Value | Type | Description |
|---|---|---|
| text | String | Specifies the text content of the specified node |
Технические детали
| Возвращаемое значение: | Строка, представляющая «отображенное» текстовое содержимое узла и всех его потомков. |
|---|
Дополнительные примеры
Пример
Этот пример демонстрирует некоторые различия между innerText, innerHTML и textContent:
<p id="demo"> This element has extra spacing and contains <span>a span
element</span>.</p>
<script>
function getInnerText() {
alert(document.getElementById("demo").innerText)
}
function getHTML()
{
alert(document.getElementById("demo").innerHTML)
}
function
getTextContent() {
alert(document.getElementById("demo").textContent)
}
</script>
Получите содержимое элемента <p> выше с указанными свойствами:
innerText возвращает: «Этот элемент имеет дополнительный интервал и содержит элемент span».
innerHTML возвращает: "Этот элемент имеет дополнительный интервал и содержит <span>элемент span</span>".
textContent возвращает: «Этот элемент имеет дополнительный интервал и содержит элемент span».
Свойство innerText возвращает только текст, без пробелов и тегов внутренних элементов.
Свойство innerHTML возвращает текст, включая все теги интервалов и внутренних элементов.
Свойство textContent возвращает текст с пробелами, но без тегов внутренних элементов.