我正试图找出 jQuery 中的 AJAX，并试图提取页面上一个元素的内容并将其注入(inject)另一个元素。这是我一直在玩的一个测试场景:
第一页:
...
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<button>Load it!</button>
<div class="content"></div>
...
第二页:
...
<div class="container">
<h1>Hello World!</h1>
<div class="text">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Qui nulla impedit a nostrum eos voluptas, quidem cum, consequatur suscipit voluptate officia sapiente laboriosam similique dignissimos praesentium obcaecati, nemo commodi, laborum!</p>
</div>
</div>
...
第一页的脚本文件:
$(function(){
$('button').on('click', function(){
$.ajax({
url: "ajax/index.html"
}).done(function(response){
$('.content').html($(response).find('.container').html());
});
});
});
stack exchange 上的一些帖子，例如 this one和 this one已经指出这是我应该使用 AJAX 从另一个页面获取 1 个元素的 HTML 的方向。但是，在第一页上运行代码时，.container 中的内容不会返回，而是将这些 jQuery 方法传递给 console.log()(console.log($(response).find('.container').html());) 返回 undefined 到控制台。这里有什么问题吗？
另外，是的，我知道这里使用 .load() 是一个选项，但我真的很想学习如何使用 jQuery 的 AJAX 方法，因为我相信它可以给程序员更多找到调整的控制。
最佳答案
更改获取响应元素容器的方式。
来自:
$('.content').html($(response).find('.container').html());
收件人:
$('.content').html($($.parseHTML(response)).filter(".container").html());
使用 $.parseHTML() 会将您的响应 string 转换为 DOM 节点，以便您可以在其中找到这些元素。
关于javascript - jQuery 在过滤 AJAX 响应时返回未定义，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31759240/