Почему консоль Chrome отображает структуру карты?

Question

Допустим, что мой HTML это:

<div class="newEntry">
    <h1 class="entry"><img src=""></h1>
     <p>Josh : 2006</p>
</div>

Просто для отладки, когда я написал

$("#newEntry").find("h1").find("img");

это показывает что-то вроде:

[prevObject: r.fn.init(0)]

в то время как я хочу видеть вывод в виде элементов HTML что-то вроде

 <h1 class="entry"><img src=""></h1>

Заявления из консоли

document.getElementsByClassName("newEntry");
[]
$("newEntry>h1")
[prevObject: r.fn.init(1)]
$("#newEntry").find("h1").find("img");
[prevObject: r.fn.init(0)]
$("#newEntry").find("h1");
[prevObject: r.fn.init]length: 0prevObject: r.fn.init {}__proto__: Object(0)
$("#newEntry").find("h1").find("img");
[prevObject: r.fn.init(0)]
$("#newEntry").find("h1").find("img").html();
undefined
$("#newEntry").find("h1").html();
undefined
$("#newEntry").html();
undefined

Answer 1

Вы использовали #newEntry который используется для получения элементов по идентификатору в jquery. Но в вашем <div> Вы не определили идентификатор. Итак, вам нужно использовать селектор класса.

Вам нужно использовать .html() чтобы получить точное содержание.

$(".newEntry").find("h1").html();

Answer 2

[prevObject: r.fn.init(0)] что элемент, который вы ищете, не найден. Потому что вы используете символ "#" для класса. Ты должен сделать:

<div class="newEntry">
    <h1 class="entry"><img src=""></h1>
     <p>Josh : 2006</p>
</div>

а также

$(".newEntry:first").find("h1").find("img");

или же

<div id="newEntry">
    <h1 class="entry"><img src=""></h1>
     <p>Josh : 2006</p>
</div>

а также

$("#newEntry").find("h1").find("img");