Почему вы не можете называть outerHTML на $(this)?

Если вы хотите получить HTML всего элемента DOM (включая оболочку), вы можете сделать следующее (как объяснено здесь):

$('#myElementId')[0].outerHTML

Но то, что вы не можете сделать, это вызвать outerHTML на $(this) внутри, например. область прослушивания кликов или область действия функции селектора:

$(this).outerHTML //Doesn't complete in IntelliSense, returns undefined in browser

или

$(this)[0].outerHTML //Correction, this DOES work, but it doesn't complete in IntelliSense

потому что IntelliSense не покажет innerHTML или outerHTML в этих обстоятельствах, хотя с ванильным JavaScript вы можете сделать:

document.getElementById($(this).attr('id')).outerHTML

Итак... что с этим?

Ответы

Ответ 1

outerHTML - свойство DOM; jQuery не предоставляет все свойства DOM.

Если у вас есть объект jQuery, вы можете напрямую обращаться к этим свойствам и методам, которые предоставляет jQuery, и наоборот для объектов DOM.

В объектно-ориентированных терминах объекты jQuery не наследуются от объектов DOM, они содержат их.

Высказывание $x[0] получает объект DOM для первого элемента, представленного объектом jQuery.

Ответ 2

Вы можете напрямую использовать this для доступа к outerHTML текущего объекта вместо косвенного прохождения через $(this), поскольку это представляет объект DOM (который имеет свойство outerHTML), тогда как $(this) представляет объект jQuery.

this.outerHTML

Ответ 3

Селектор jQuery возвращает объект типа jQuery, подобный массиву, который не имеет свойства outerHTML.

Однако, результирующий массив jQuery содержит элементы DOM.
Это означает, что вы действительно можете получить к нему доступ таким образом.

$(".someClass")[0].outerHTML // it works for me

Update: Он работает для меня в каждом браузере.
Я также могу получить доступ к объекту jQuery, подобному массиву, в обработчике событий щелчка.

$(".someClass").click(function()
{
    alert($(this)[0].outerHTML); // it works me too
});

Вот мой JSFiddle: http://jsfiddle.net/13btf60p/

Обновление 2:

ОК, теперь я получаю ваш вопрос. Должно быть, это сработало. Вам действительно нужна IntelliSense для создания такой простой и простой конструкции?

Ответ 4

Я добавлю то, что я нашел правильным решением для того, что в итоге стало простой ошибкой в ​​настройках Visual Studio по умолчанию для будущих ссылок.

Так как я не хотел этого отпускать, я искал дальше и узнал, что по умолчанию jQuery IntelliSense несколько прискорбно из коробки в Visual Studio 2013.

В <

Инструменты > Параметры > Текстовый редактоp > Javascript > IntelliSense > Ссылки

Я установил

Справочная группа: "Неявный (Web)"

и добавил существующий файл jQuery. Это позволило решить все вопросы моего вопроса, и IntelliSense теперь предлагает всем членам и методам правильно, хотя это должно было просто работать из коробки, а не стоить каждому в кучу времени.