Почему innerHTML возвращает 'undefined'?

Я пытаюсь поймать "значение" внутри этого div, которое доступно для редактирования:

<div class="editable-div" contentEditable="true">Hey</div>

Я решил, что могу сделать это просто с помощью JavaScript:

var changedText = $('.editable-div').innerHtml

Однако эта переменная всегда будет возвращать "undefined", что меня смущает.

Может кто-нибудь просветить меня о том, как достичь этой "ценности"?

Ответы

Ответ 1

Это jQuery - вы должны использовать:

$('.editable-div').html()

Ответ 2

Объект, обернутый jQuery, на самом деле не является сырым DOM node, но по существу является массивом необработанных узлов DOM, на которые можно воздействовать с помощью специальных методов jQuery, таких как .html(). Если вы хотите взаимодействовать с DOM node, вы можете получить его путем либо итерации по списку, либо получения элемента этого списка, если вы знаете, какой из них он:

$('div').each(function(index, element) {
  element.innerHTML // ...
}

$('div').get(0).innerHTML
$('div')[0].innerHTML

Обратите внимание, что, хотя это "тип", как массив, вы можете получить узлы DOM, используя синтаксис массива $('div')[0], вы не можете рассматривать его как массив в Javascript. Другими словами, вы не можете сделать это:

$('div').forEach(function(element) {
  element.innerHTML
}

Ответ 3

innerHtml используется с javascript-селектором, и вы используете jQuery. поэтому замените innerHtml на .html() или .text().

Используйте это:

var changedText = $('.editable-div').html();

Ответ 4

innerHtml - DOM. try $('. editable-div') [0].innerHtml