javascript - grunt 如何替换 HTML 元素？

Question

我正在使用 grunt 将标记从 dust 模板复制到 JSP。我有许多 JSP 页面，我想在其中用带有 spring 标记的本地化类替换 span

    <div class="push-right">
      <a href="/credentials/login">
      <span class="localize" name="top_bar.sign_in">Sign In</span>
      </a> |
      <a href="/credentials/register">
      <span class="localize" name="top_bar.register">Register</span>
      </a>
    </div>

所以这个 block 应该变成这样

    <div class="push-right">
      <a href="/credentials/login">
        <spring:message code="top_bar.sign_in" />
      </a> |
      <a href="/credentials/register">
        <spring:message code="top_bar.register" />
      </a>
    </div>

更新@Sam 提供了一个很好的 RegEx 示例，我现在正在关注它。我正在构建一个我推送到数组的对象

var reLocalize = new RegExp('<span(?=[^>]*?class="localize").*?name="([^"]*).*?<\/span>', 'g');
localizeReplaceObject.match = reLocalize;
localizeReplaceObject.replacement = '<spring:message code=$1 />';
localizeReplaceArray.push(localizeReplaceObject);

然后我运行 grunt replace

    replace: {
      localize: {
        options: {
          patterns: localizeReplaceArray
        }
        ,files: [
        {expand: true, flatten: true, src: ['../WEB-INF/views/index.jsp'], dest: '../WEB-INF/views/'}
        ]
    }

我再次运行 grunt grunt replace:localize 但 index.jsp localize 标签没有更新。

Running "replace:localize" (replace) task
Verifying property replace.localize exists in config...OK
Files: ../WEB-INF/views/index.jsp -> ../WEB-INF/views/index.jsp
Options: encoding="utf8", mode=false, processContentExclude=[], patterns=[{"match":{},"replacement":"<spring:message code=$1 />"}], excludeBuiltins=false, force
filePair src ../WEB-INF/views/index.jsp
Reading ../WEB-INF/views/index.jsp...OK
Processing source...Replace ../WEB-INF/views/index.jsp → ../WEB-INF/views/index.jsp
OK
Writing ../WEB-INF/views/index.jsp...OK

Done, without errors.

Answer 1

使用类似 grunt-replace 的工具(谢谢，@Pinal)使用以下表达式将 span 元素与 class="localize" 匹配并捕获 name 属性:

<span(?=[^>]*?class="localize").*?name="([^"]*).*?<\/span>

Demo