Question

我有一些代码可以替换＃body-inner中我的页面内容中的## Some Content ##的任何实例，并将其替换为：

<span class="tooltipster" data-tooltip-content="#Some Content">Some Content</span>

这样做没问题，但想将data-tooltip-content="#Some Content"转换为小写并删除带有“ - ”的空格。

见下面的代码：

$('#body-inner').children().each(function(){
        $(this).html( 
            $(this).html().replace(/##(.*?)##/gm,'<span class="tooltipster" data-tooltip-content="#$1">$1</span>')
        );
    });

Answer 1

您可以使用带有回调函数的replace#String来执行此操作。虽然您可以通过each()方法使用回调来避免使用html()方法。

// use html method with callback which iterates over the element where old html is the second argument
$('#body-inner').children().html(function(i, html) { 
  // replace all match substring
  return html.replace(/##(.*?)##/gm, function(m, m1) {
    // generate the html string
    return '<span class="tooltipster" data-tooltip-content="#' + m1.toLowerCase().split(' ').join('-') + '">' + m1 + '</span>';
    // instead of split and join, you can also use .replace(/\s/g, '-')
  });
});

＆＃13;

$('#body-inner').children().html(function(i, html) {
  return html.replace(/##(.*?)##/gm, function(m, m1) {
    return '<span class="tooltipster" data-tooltip-content="#' + m1.toLowerCase().split(' ').join('-') + '">' + m1 + '</span>';
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="body-inner">
  <div>##abc def##</div>
  <div>abc ##def dfdfd## ##fdfdf sdsds##</div>
</div>

＆＃13;

使用“ - ”操作变量以降低和替换空格

1 个答案: