.unwrap()在.append().load()之后无法工作

Question

我现正这样做：

$("div#js-product-list .products.row").append($("<div>").load('http://andreisdev.tk/alexstan/en/2-home?page=' + page_nr + ' .products.row article.product-miniature.js-product-miniature'));

然后我将增加page_nr，这在这个问题中并不重要，因为它可以工作。

之后，我试图打开页面中刚刚加载的article，使其与页面中其他article的兄弟关系，因为load覆盖了您所做的选择，所以我必须在所有当前文章的末尾创建该div。

我试着用这样的方式解开它们：

$('article.product-miniature.js-product-miniature ~ div article.product-miniature.js-product-miniature').unwrap();

因此，基本上，我选择的是刚刚作为兄弟级附加到当前articles的div，然后选择刚刚加载到新div中的article，并尝试将它们展开。

如果我在控制台中这样做，首先使用.append().load()输入命令并运行它，然后.unwrap() --它运行得很好--如果我同时插入和运行这两个命令--尽管它不工作--这与我的.js文件中发生的事情是一样的。

我的成功之处是：

setTimeout(function() {
  $('article.product-miniature.js-product-miniature ~ div article.product-miniature.js-product-miniature').unwrap(); 
}, 500);

但必须有一种直接的方法。

EDIT !!!

由于这些评论不会被太多人看到，以下是回应：

$("div#js-product-list .products.row").append($("<div>").load(''+link+' .products.row article.product-miniature.js-product-miniature', function() { $('article.product-miniature.js-product-miniature ~ div article.product-miniature.js-product-miniature').unwrap(); }));

Answer 1

问题是，因为load()是异步的，所以您正在尝试展开还不存在的元素。这就是为什么使用超时来延迟逻辑的原因。

一个更好的解决方案是使用load()的回调参数来提供一个函数，在将内容添加到DOM之后执行您的解包装逻辑。如下所示：

$("div#js-product-list .products.row").append($("<div>").load('http://andreisdev.tk/alexstan/en/2-home?page=' + page_nr + ' .products.row article.product-miniature.js-product-miniature', function() {
  $('article.product-miniature.js-product-miniature ~ div article.product-miniature.js-product-miniature').unwrap();
}));