jQuery: получить нормальный JS формат элемента html

Question

Я использую jQuery и все работает отлично, за исключением нескольких вещей. Есть несколько вещей, которые вы не можете сделать с форматом элемента jQuery, но только с простым форматом JS. Особенно при использовании hasAttributes() в простом JS.

Это работает:

let fooDiv = document.getElementsByTagName("div")[0];
console.log(fooDiv.hasAttributes()); //returns false as expected
let barDiv = document.getElementsByTagName("div")[1];
console.log(barDiv.hasAttributes()); //returns true as expected

<div>foo</div>
<div id="id">bar</div>

Это не:

let fooDiv = $(document.getElementsByTagName("div")[0]) //creates a jQ object
console.log(fooDiv.hasAttributes()); //error
let barDiv = $(document.getElementsByTagName("div")[1]) //creates a jQ object
console.log(barDiv.hasAttributes()); //error

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>foo</div>
<div id="id">bar</div>

Я знаю, что jQuery hasAttr() существует, но я хочу получить формат JS объекта jQuery. Есть много отличий, например, jQuery создает object, но в остальном это список html.

Изначально мой вопрос:

Как получить список узлов html или элемент html или простой JS формат элемента (ов) html из jQuery?

Answer 1

Чтобы расширить сказанное в комментариях blex ... когда jQuery используется для выбора элемента HTML, необработанный HTML всегда собирается в массиве как часть переменной, которой вы его назначаете. Например, используя ваш код:

// grab the element or elements
let fooDiv = $(document.getElementsByTagName("div")[0]);

// lets see the HTML!
consoe.log( fooDiv[0] ); 

Сам массив HTML будет представлен в этом массиве, предоставляя прямой доступ к HTML и его свойствам ... например:

console.log( fooDiv[0].innerHTML );

или

console.log( fooDiv[0].tagName );