我有
$.ajax({
url: identity,
success: function(data) { ProcessIdentityServer(data) }
});
当返回'data'时,是否有办法针对它运行选择器而不将其添加到DOM中.那么,例如,如何在不将数据首先添加到DOM中的情况下获取"数据"中包含的HTML中包含的任何LINK标记的所有href值？如果我想要做的就是将一些东西提取到一个数组中,那么将它添加到DOM中似乎是一种耻辱.有人有任何想法吗？
stu*_*ton 107
我将在这里添加的一个注意事项是,如果您的AJAX返回以下内容:
<div class="test">Hello</div>
<div class="one">World</div>
下面的jQuery 不会工作:
$(data).find('div.test');
因为div是顶级元素而数据不是元素而是字符串,因此需要使用它才能使其工作 .filter
$(data).filter('div.test');
Bea*_*sen 38
// Finds all div elements within an XML document from an AJAX response.
$("div", xml.responseXML);
Dav*_*uis 32
在开始之前,让我们快速浏览一下jQuery对$.ajax()调用返回的基本HTML页面的作用,并将返回的数据转换为jQuery对象.
$.ajax({
dataType : 'html',
url : 'path/to/example-page.html',
success : function(data) {
// log the result of the data converted into a jquery object.
console.log( $(data) );
}
});
以下是您期望看到的内容:
[
0 <TextNode textContent="\n\n\n\n\n ">
1 title
2 <TextNode textContent="\n ">
3 meta
4 <TextNode textContent="\n\n\n\n\n">
5 div#container
6 Comment { data=" #container ", length=12, nodeName="#comment", more...}
7 <TextNode textContent="\n\n">
jquery "1.6.4"
length 8
selector ""
// additional data and functions removed for brevity
]
哎呀! 那太难看了!尝试对此做任何事情都可能产生结果,但您需要知道每次数据结构的样子,以及数据在该对象中的位置.这些数据是根源还是埋没在？
就像以前的海报所提到的那样,你可以使用.filter(),但根据搜索的目的就是根,因为你只是过滤了返回的结果.但是,如果您.find()在此时使用并且您想要的元素位于根目录,那么您将收到一个空集,但是会找到埋在根之外的任何内容.
那么,为什么要坚持需要100%确定地知道数据结构是什么样的,为什么要经历所有必须使用多个.filter()和.find()调用的麻烦,并且我敢说一个.each()循环呢？呸!这只是太多的工作而且花费了太多时间.
如果您想要.find()从.ajax()调用返回的特定HTML元素,请从以下行开始:
var response = $('<html />').html(data);
这真的很容易吗？事实上,是的!这里发生的是<html>创建一个新元素并将其转换为jQuery对象.这用于从.ajax()调用中插入返回的HTML的起始位置.这有点像$('html')在网页上做.有了这个,你可以开始寻找元素.
response.find( ... ); // any jquery selector in place of the ellipsis.
这是一个使用原始海报问题的例子:
$.ajax({
dataType : 'html',
url : 'path/to/example-page.html',
success : function(data) {
// set the returned contents in a new base <html> tag.
var response = $('<html />').html(data),
anchors, hrefValuesList = [ ],
i, end;
// now you can search the returned html data using .find().
anchors = response.find('a');
// grab all your href values from each anchor element.
end = anchors.length;
for (i = 0; i < end; i++) {
hrefValuesList.push( anchors[ i ].href );
}
// continue processing the data as necessary...
}
});
显然,如果您想过滤掉任何不需要的内容,或者想要优化返回的值,上面的内容将需要一些改进.
有了它,你可以看到类似下面返回的示例数组:
[ "http://stackoverflow.com/", "http://www.google.com/" ] // and so on...
使用这种方法,您可以轻松地使用.find()通过$.ajax()函数返回的任何HTML数据的强大功能,就像您在DOM中找到的任何元素一样.真正的好处是,您不是直接操纵DOM来查找或执行您想要的操作,这是一个昂贵的过程.
快乐擦洗!=)
nak*_*ima 20
假设这data是一串HTML,你可以这样做:
$(data).find('a');
这将返回链接而不将数据添加到DOM.
| 归档时间： |
|
| 查看次数： |
73893 次 |
| 最近记录： |