Question

我用reactjs创建了网站。对于restAPI，我使用java和CMS是liferay。在liferay中，我创建了手风琴的短代码，如

('[accordion][acc-header]Heading 1[/acc-header][acc-content]Content1[/acc-content][acc-header]Heading 2[/acc-header][acc-content]Content2[/acc-content][/accordion]')。

我想替换html元素而不是这个字符串。怎么做javascript？

你走了，

[accordion]
 [acc-header]Heading 1[/acc-header][acc-content]Content1[/acc-content]
 [acc-header]Heading 2[/acc-header][acc-content]Content2[/acc-content]     
[/accordion]

Html输出，

<div class="accordion">
  <h3>Heading1</h3>
  <div class="accordion-content">
    content 1
  </div>
<h3>Heading2</h3>
  <div class="accordion-content">
    content 2
  </div>
</div>

Answer 1

肮脏而快捷的方式：

angular
  .module('AutocompleteApp', ['ngMaterial'])
  .controller('AutocompleteController', function($scope, $http, $filter) {
    var vm = this;

    // data for autocomplete
    vm.getMatches = function(searchText) {

      if (!vm.employees) {

        getEmployees().then(function(employees) {

          vm.employees = employees;
          var term = searchText && searchText.toLowerCase();
          if (!term) {
            return [];
          } else {
            return $filter('filter')(vm.employees, term);
          }
        });

      } else {
        var term = searchText && searchText.toLowerCase();

        if (!term) {
          return [];
        } else {
          return $filter('filter')(vm.employees, term);
        }
      }

    };

    // how we get employee data 
    function getEmployees() {
      return $http.get('employees.json').then(function(response) {
        return response.data;
      }, function failureCallback(response) {
        reject("Error!");
      });
    }

  });

结果是：

var s = '[accordion][acc-header]Heading 1[/acc-header][acc-content]Content1[/acc-content][acc-header]Heading 2[/acc-header][acc-content]Content2[/acc-content][/accordion]';
s.replace(/\[([a-z\-]+)]/g, '<div class="$1">').replace(/\[\/[a-z\-]*]/g, '</div>')

这不会添加"<div class="accordion"><div class="acc-header">Heading 1</div><div class="acc-content">Content1</div><div class="acc-header">Heading 2</div><div class="acc-content">Content2</div></div>"代码

如何在javascript中替换多次出现的字符串？

1 个答案: