jQuery .html() from object возвращает undefined

Question

Я использую следующую функцию javascript для загрузки контента из другого URL-адреса в текущий документ. Почему contentHtml и menuHtml не определены, что я не так? Я также не знаю, что означает [prevObject.., это выглядит нормально или есть что-то не так?

function exhibitload(url) { 
     $.get(url, {}, function (data) { 
      console.log(data); 
      var content = $(data).find('#exhibit'); 
      var menu = $(data).find('#index'); 

      console.log(content); // [prevObject: n.fn.init[47], context: undefined, selector: "#exhibit", jquery: "2.1.3", constructor: function…] 
      console.log(menu); // [prevObject: n.fn.init[47], context: undefined, selector: "#index", jquery: "2.1.3", constructor: function…] 

      var contentHtml = $(content).html(); 
      var menuHtml = $(menu).html(); 

      console.log(contentHtml); // undefined 
      console.log(menuHtml); // undefined 

      $('#exhibit').html(contentHtml); 
      $('#index').html(menuHtml); 
      $('body').removeClass('loading'); 
     }); 
    } 

Answer 1

Вы пытаетесь .find() элемент в пределах элемента (объекты JQuery набор, содержащий элемент) сам. Вы должны искать элемент в одном из своих родителей, который является отдельным объектом JQuery (<div> в примере ниже)

Попробуйте это:

var html = $('<div/>').append(data); 
var content = html.find('#exhibit'); 
var menu = html.find('#index'); 

DEMO

Answer 2

Смените find():

 var content = $(data).find('#exhibit'); 
     var menu = $(data).find('#index'); 

Для filter():

 var content = $(data).filter('#exhibit'); 
     var menu = $(data).filter('#index'); 

DEMO

var data = $('body').contents(); 
 
console.log(data); 
 
var exh = $(data).filter('#exhibit'); 
 
console.log('Exhibit'); 
 
console.log(exh[0]); 
 
var ind = $(data).filter('#index'); 
 
console.log('Index'); 
 
console.log(ind[0]);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
Here's all the data: 
 
<div id="exhibit">Exhibit Div</div> 
 
<div id="index">Index Div</div>