Jquery 将WordPress帖子附件提取到帖子外部的无序列表

我正在努力：

在WP帖子中搜索附件（img和IFRAME）

---

将这些内容从文章外部移动到代码层次结构中较早的位置

在无序列表中以列表项的形式呈现每一项，以便各种滑块/图库插件都可以使用它们

问题是，我看不出如何在项目之间循环分配

标记，同时动态添加包装器

，如果需要的话

目前，我有这段代码，但对jQuery经验不足，不知道我做错了什么：

jQuery("document").ready (function(){

   jQuery(".para img, .para iframe").(function(){
    var nUl = jQuery("<ul></ul>");
    nUl.prependTo(jQuery(this).parents(".content-inset-wrap"));
 })
 jQuery(this).each(function(){
  var nLi = jQuery("<li></li>");
  nLi.appendTo(nUl);
  nLi.append(this);

})

jQuery（“文档”）.ready（函数（）{
jQuery（“.para img，.para iframe”）（函数（）{
var nUl=jQuery（“
”）；
num.prependTo（jQuery（this.parents）（.content inset wrap））；
})
jQuery（this）.each（function（）{
var nLi=jQuery（“
”）；
nLi.附录（nUl）；
nLi.追加（本）；
})

}))

我知道可能有另一种方法可以做到这一点，使用直接的WP查询帖子附件，但绝对不知道这是如何工作的；我看不出有任何理由不在上面的直接js中尝试。我怀疑

和

循环问题在任何情况下都会存在

值得一提的是，这段代码与我试图做的一样，但存在循环问题，因为找到的每个图像或iframe都有自己的

以及
：

jQuery("document").ready (function(){
jQuery(".para img, .para iframe").each(function(){

  var nUl = jQuery("<ul></ul>");
  var nLi = jQuery("<li></li>");

  nUl.prependTo(jQuery(this).parents(".content-inset-wrap"));
  nLi.appendTo(nUl);

  nLi.append(this);

})

jQuery（“文档”）.ready（函数（）{
jQuery（“.para img，.para iframe”）.each（函数（）{
var nUl=jQuery（“
”）；
var nLi=jQuery（“
”）；
num.prependTo（jQuery（this.parents）（.content inset wrap））；
nLi.附录（nUl）；
nLi.追加（本）；
})

}))

非常感谢任何帮助

谢谢。
jQuery（“文档”）.ready（函数（）{
jQuery("document").ready (function(){

jQuery('.para').each(function() {
var html='';
 html='<ul>';

jQuery('img', this).each(function() {
    html+= '<li>'+ jQuery(this).prop('outerHTML') +'</li>';
    console.log(html);
    jQuery(this).remove();
});

jQuery('iframe', this).each(function() {
  html+= '<li>'+jQuery(this).prop('outerHTML')+'</li>';
  jQuery(this).remove();
});

html += '</ul>';

jQuery(this).parent('.content-inset-wrap').prepend(html);
});


});

jQuery（'.para'）。每个（函数（）{
var html=''；
html=“
”；
jQuery（'img'，this）.each（function（）{
html++'
'+jQuery（this.prop（'outerHTML'）++'
'；
log（html）；
jQuery（this.remove（）；
});
jQuery（'iframe'，this）.each（函数（）{
html++'
'+jQuery（this.prop（'outerHTML'）++'
'；
jQuery（this.remove（）；
});
html+='
'；
jQuery（this）.parent（'.content inset wrap'）.prepend（html）；
});
});
“将这些内容从文章外部移动到代码层次结构中较早的位置”你是什么意思？@David它们当前出现在文章包装中，即在.content inset wrap>.para>img中。我想将它们向上移动到层次结构中，以便它们在视觉上显示在诸如文章标题、日期等内容之前，即在它们之前。希望这更清楚？这几乎奏效了。para类中同时包含文本和图像（以及iframe），因此我需要在保留文本的同时提取图像和iframe。目前，执行代码并在
.para
选择器后添加
img
，只需完全删除图像，并在内容插入包装内添加正确数量的
标记（但不包括图像）。我也不熟悉您在这里所做的事情-看起来您正在动态地重新定义变量？基本上每个变量都会循环遍历每个元素，因此您正在构建一个变量以插入到更高的位置。你有一个链接到你正在做这件事的地方吗？没有链接-在本地开发-但如果这有帮助的话我可以上传？我已经创建了一个小提琴来显示问题，使用你的代码和我网站的相关部分。好吧，你欠我一大笔钱。我在上面更新了一个新版本，您的问题是没有标识符，而且.next（）似乎有效…请参阅此处的工作。