如何使用JQuery将链接转换为文本？

Question

我试着想出可以取代文本链接的功能。标签内的图像应移动到包装器，原始的a应该被删除。

JS：

var selectors = 'a.mark-video;a.sp5;a>img[alt!=""]'
selectors = selectors.split(";").join(", ");

$(selectors).each(function() {
    var current = this;
    if (this.nodeName == "IMG") {
      current = this.parentNode;
      if (current.nodeName != "A")
        current = this.parentNode;
      if (current.nodeName != "A")
        return false;
      current = $(current);
    }
    var wrapper = current.parent();
    var new_context = $().append(current.html());
    current.remove();
    wrapper.append(new_context);
  }
);

问题是 1）图像未插入包装中 2）如果插入它将没有正确的位置。

我正在尝试使用webextensions API（Firefox插件）并将代码注入网站： http://zpravy.idnes.cz/zahranicni.aspx

在调试器中，您可以看到两个包含class =＆＃34; art＆＃34;的包装器。我删除了第一个链接但未插入图像。当第一次迭代后调试器暂停时，第二个尚未被删除。

我希望您能找出未附加图片的原因以及如何将其附加到元素a的原始位置。我需要首先找到元素a的位置，然后将图像移动到正确的位置 - 即div.art-info之前。

注意：请不要更改选择器字符串。这是表单字段中的用户输入。

修改

几乎就在那里：

function(){
   if (this.parentNode.nodeName == "A")
    $(this.parentNode).replaceWith($(this));
   else
    $(this).html().replaceWith($(this)); // error: html() result does not have replaceWith...
  }

Answer 1

这是你要找的吗？

https://jsfiddle.net/4tmz92to/

var images = $('a > img');

$.each(images, function(key, image) {
    $(this).parent().replaceWith(image);
});

首先选择要删除链接的所有图像，然后循环浏览它们，只需将parent()替换为图像。

Answer 2

我终于解决了这个问题：

$(selectors).each(
function(){
   if (this.parentNode.nodeName == "A")
    $(this.parentNode).replaceWith($(this));
   else
    $(this).replaceWith(
      $(this).html()
      );
  }
);

这种方法类似。 Novocaine建议不要使用$（this）.html（），但这会跳过一些图片，所以我更喜欢使用它。