在jQuery中，我们通过ajax的方法获取另一个页面内的数据，使用这些数据作为本页面的局部内容。可是在获取远端HTML数据时，有时我们发现jQuery选择器失效，这是什么原因呢？
我们来看一下jQuery中的ajax方法的基本结构：
[code lang="javascript" line="1"]
$.ajax({
type : 'GET',
url : 'http://' + $domain + '/aoyun/index.html',
dataType : 'html',
beforeSend : function(){
$myTip.text('加载中...');
},
success : function(data){
var $china = {},$chinaData = $(data).find('#forChina table tr.bg td');
$china.jin = $chinaData.eq(1).text();
$china.yin = $chinaData.eq(2).text();
$china.tong = $chinaData.eq(3).text();
$myTip.html('中国：金' + $china.jin + ' 银' + $china.yin + ' 铜' + $china.tong + '');
},
error : function(XMLHttpRequest, textStatus, errorThrown){
//alert(XMLHttpRequest.readyState);
}
});
[/code]
我们关心的是success:function(data)部分。其中返回的data决定着我们这个问题的成败。我们来对比以下两段返回值：
[code lang="php" line="1"]
.....
...
[/code]
在这一段中，我们将#myWant直接放置在body内，再来看下一段
[code lang="php" line="1"]
...
...
[/code]
而在这一段中，我们将#myWant放置在#container内。这两段的区别就在于，我们在ajax的success中用$(data).fin('#myWant')是否可以取到数据，第一段取不到，第二段可以取到。
jQuery中ajax的逻辑就是<body>以外及其直接子节点都是不可被选取的，在success:function(data)中，data为返回的DOM，而利用$(data).find()进行查找时，文档内容（<body>内）的根是不可被选择的。再举一个例子：我们有时直接返回一段HTML代码，如下
[code lang="php" line="1"]
[/code]
如果直接用$(data) .find('li')就无法获取，而找find('#title')则可取。
所以下一次记得在你的数据被请求页面外套上一个<div>吧。
