36

我正在使用 jQuery 的 ajax 代码加载新页面，但希望他只获取 div 的 html。

我的代码： HTML：

<body>
    <div id="content"></div>
</body>

脚本：

$.ajax({
   url:href,
   type:'GET',
   success: function(data){
       $('#content').html(data);
   }
});

我希望他在另一个页面上只获得 $('div#content') 的 html。怎么做？

4

5 回答 5

49

好的，您应该“构造” html 并找到 .content div。

像这样：

$.ajax({
   url:href,
   type:'GET',
   success: function(data){
       $('#content').html($(data).find('#content').html());
   }
});

简单的！

于 2013-09-21T22:47:26.110 回答
32

您可以使用 JQuery .load() 方法：

http://api.jquery.com/load/

 $( "#content" ).load( "ajax/test.html div#content" );
于 2013-09-22T00:11:20.590 回答
17

如果您正在寻找来自不同域的内容，这将起到作用：

$.ajax({
    url:'http://www.corsproxy.com/' +
        'en.wikipedia.org/wiki/Briarcliff_Manor,_New_York',
        type:'GET',
        success: function(data){
           $('#content').html($(data).find('#firstHeading').html());
        }
});
于 2014-10-19T22:55:44.253 回答
9

不幸的是，ajax 请求会获取整个文件，但您可以在检索到内容后对其进行过滤：

$.ajax({
   url:href,
   type:'GET',
   success: function(data) {
       var content = $('<div>').append(data).find('#content');
       $('#content').html( content );
   }
});

请注意，虚拟元素的使用find()仅适用于后代，并且不会找到根元素。

或者让 jQuery 为你过滤它：

$('#content').load(href + ' #IDofDivToFind');

我假设这不是跨域请求，因为这不起作用，只有同一域上的页面。

于 2013-09-21T22:11:37.650 回答
3 
$.ajax({
  url:href,
  type:'get',
  success: function(data){
   console.log($(data)); 
  }
});

这个控制台日志得到一个类似对象的数组：[meta, title, ,]，很奇怪

你可以使用JavaScript：</p> 

var doc = document.documentElement.cloneNode()
doc.innerHTML = data
$content = $(doc.querySelector('#content'))
于 2016-04-18T13:44:39.680 回答