如何使用.load（）只加载页面中某个元素的内容而不是整个页面？

Question

我有一个页面，用户可以添加，编辑和更新几个细分。我在外部页面中拥有所有这些段，并使用jquery .load（）函数来完成此任务。但是，我担心一些事情：

1。问题

说我的网页上有其中一个细分＆＃39;＃area＆＃39;我想要更新，就像这样

<div id="area">
    <!-- Contents -->
</div>

代码$("#area").load("something.html #area");给出以下结果

<div id="area">
  <div id="area">
    <!-- Contents -->
  </div>
</div>

无论是什么触发了这个动作，如果你再次这样做，会导致更多的嵌套（坏）。

解决方案

我。解释here

$("#area").load("something.html #area > *");

II。在第3号答案中解释here

$('#area').load('/ajax/loader', function() {
    $(this).children(':first').unwrap();
});

1. $("#area").load("something.html #area > *"); **加载整个页面，然后jquery解析不需要的内容。所以，它绝对是浪费带宽和浏览器资源。

需要澄清：

1. 问题1的2个解决方案中哪个是最合适，优雅和干净的方法，并且也是跨浏览器兼容的（听到使用＆＃39; ＆gt; * ＆＃39;的一些问题）
2. 有没有办法我只能加载所需页面的内容，而不是加载整个页面并在客户端解析它。

提前致谢。

Answer 1

  

  
1. 问题1的2个解决方案中哪一个是最合适，优雅和干净的方法，并且也是跨浏览器兼容的（听到使用＆＃39;＆gt; *＆＃39;）的一些问题。
  

$("#area").load("something.html #area > *");

这是对您的问题最简洁的答案。使用后代选择器应该不是问题，尽管全能*有点不雅观。

  

  
1. 有什么方法可以只加载所需页面的内容，而不是加载整个页面并在客户端解析它。
  

没有。发出请求时，响应始终相同 - 整个页面的HTML。只有jQuery在后台执行才能选择所需的元素，这使得它看起来只有部分页面被检索出来。