Разница между innerText и HTML

Question

В чем разница между innerText, text() и html()?

Answer 1

innerText (или text(), если вы используете jQuery) не содержит тегов HTML. Так что если у вас есть div, который содержит:

View my <a href="profile.html">profile</a>

innerText / text() вернется

View my profile

пока html() вернется

View my <a href="profile.html">profile</a>

Как указывает dcneiner html() / text() являются свойствами jQuery (и поддерживаются во всех браузерах), в то время как innerText не реализован во всех браузерах (хотя он работает в самых последних версиях IE, Safari и Chrome).

Как правило, вы захотите использовать text() вместо innerText, когда это возможно. См. dcneiner post (или jQuery docs ) для некоторых других вещей, которые делают text() потрясающим.

Answer 2

Разница в том, что innerText является свойством только IE для объекта DOM, а html() является функцией объекта jQuery.

Однако, если вы сравнивали text() и html(), тогда разница в том, что text() удаляет весь HTML из содержимого элемента перед возвратом, а html() включает в себя HTML.

Кроме того, text() вернет текст всех сопоставленных элементов и объединит их вместе:

<span>Hi, </span><span>how are </span><span>you?</span>

$("span").text(); // returns: Hi, how are you?

Но html() вернет только первые подходящие элементы innerHTML свойство:

$("span").html(); // returns: Hi, 

Еще одна крутая вещь: .text() автоматически экранирует весь HTML:

$("span:first").text('<a>Hi</a>'); // writes &lt;a&gt;Hi&lt;/a&gt;