jquery，递归替换多个元素

Question

我遇到了以下问题。 我通过脚注解释一些内容。脚注例如[10] 的格式为 <sup>[10]</sup> 。 screenshot of content with footnotes

我正在尝试替换 <sup>[10]</sup>与 <a href="#m10" data-toggle="modal"><sup>[10]</sup></a>通过使用以下 jQuery:

<script type='text/javascript'>
$(window).on('load', function() {
    $(function(){
        var s = $('sup').html().slice(1, -1);
        $("sup").replaceWith('<a href="#m'+s+'" data-toggle="modal"><sup>['+s+']</sup></a>');
    });
}); 
</script>

不幸的是，这段代码用相同/第一个找到的脚注替换了所有脚注 - 在这种情况下，所有脚注都被替换为“10”(参见屏幕截图)。我想递归地替换每个脚注。

我不知道如何解决这个问题，卡住了几天。也许你们中的任何人都可以帮助我。 非常感谢。

Answer 1

$('sup').each(function () {
  $(this).wrap('<a href="#m' + $(this).html().slice(1, -1) + '" data-toggle="modal"></a>');
});

看看 .each() 方法。问题是您的代码仅运行一次，而不是在每次出现 <sup> 的上下文中运行