javascript - Jquery wrap()- 正斜杠前的字符 `/`

Question

在正斜杠 / 之前，我可以 wrap() HTML 标签内的字符吗？我想将所有字符包装到 /

之前的 HTML 元素中

jQuery 片段:

var x = jQuery('.elementor-drop-cap-yes p').contents().filter(function(){
  return this.nodeType === 3
}).wrap('<span class="drop-caps" />');

当前结果:

<p>
  <span class="a">
    <span class="b">1</span>
  </span>
  0/10
</p>

预期结果:

<p>
  <span class="a">
    <span class="b">1</span>
  </span>
  <div class="c">
    <b class="d">0</b>/10
  <div>
</p>

提前致谢!

Answer 1

你可以尝试下面的简单逻辑来实现html包装

jQuery(function(){
  jQuery('.elementor-drop-cap-yes p').each(function(){
     var $div = jQuery('<div/>');
     var $children = $(this).children();
     $div.append($children);
     var text = jQuery(this).text();
     if(text.indexOf('/')>=0) {
        var index = text.indexOf('/');
        //console.log(index);
        var textParts = text.substring(0, index);
        var newHTML = '<div class="c"><b class="d">' + text.substring(0, index) +'</b>' + text.substring(index, text.length) + '</div>';
        jQuery(this).empty().append($children).append(newHTML);
     }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="elementor-drop-cap-yes">
<p>
    <span class="a">
         <span class="b">1</span>
     </span>
    0/10
</p>
</div>