Почему вы не можете вызвать externalHTML на $(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

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

4 ответа

Решение

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

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

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

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

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

this.outerHTML

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

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

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

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

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

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

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

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

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

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

Под

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

Я поставил

Референтная группа: "Неявный (Интернет)"

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

this.outerHTML достаточно.

Если вы используете getElementById может быть, вы можете использовать:

var table = document.getElementById('blablabla');
Другие вопросы по тегам