Jquery/javascript,从ajax响应中过滤html对象

Jquery/javascript, filtering html object from ajax response

本文关键字:过滤 html 对象 响应 ajax javascript Jquery      更新时间:2023-09-26

我有一段html:

<div id="1">
  <div class="text">
     Text for div 2 
  </div>
<img src="images/image1.jpg"></img>
</div>
<div id="2">
  <div class="text">
    Text in div 2
  </div>
  <img src="images/image2.jpg"></img>
</div>
我用一个简单的。ajax-call 获取

var html = $.ajax({
         url: "htmlsnippet.html",
         cache: false,
         async: false,
         dataType: "html"
         }).responseText;

如果我用:

var htmlFiltered = $(html).filter("#1");

效果很好,我得到了整个div id="1"
但是如果我使用:

var htmlFiltered = $(html).filter("#1 .text");

htmlFiltered变量是一个空对象。我不知道我做错了什么。

应该这样存储:

$.ajax({
   url: "htmlsnippet.html",
   cache: false,
   async: false,
   dataType: "html",
   success: function(data){
      html = data;
   }
}

编辑:你获取html的方式有效,但不推荐。
你不能抓取最后一个元素,因为你使用的是filter而不是find,所以你应该有:

var htmlFiltered = $(html).find("#1 .text");
不是

var htmlFiltered = $(html).filter("#1 .text");

W3C还建议不要使用数字id。

EDIT 2: This should work:

var htmlFiltered = $(html).filter("#1").find(".text");

希望这对你有帮助。欢呼声

如果您不需要完整的$.ajax方法所提供的任何特殊功能,您应该尝试$.load():

.load()方法与$.get()方法不同,它允许我们指定要插入的远程文档的一部分。这是通过url参数的特殊语法实现的。如果字符串中包含一个或多个空格字符,则假定第一个空格后面的字符串部分是jQuery选择器,它决定要加载的内容。

$('#result').load('ajax/test.html #container');

http://api.jquery.com/load/loading-page-fragments

这个适合我:

$.get(url,function(content) {
    var content = $(content).find('div.contentWrapper').html();
    ...
}