javascript - jQuery-在句子中查找单词并添加跨度

我正在编写一个在句子中查找单词并在顶部添加跨度的函数。这是代码，但是不起作用。谁能指出我的错误？谢谢

  function find_and_add(element = "", findWord = "") {
      $(element).each(function() {
        var arr = $('h1 a', this).text().split(' ');
        var newTitle = "";
        $.each(arr ,function(key, value) {
          if (value == findWord) {
            newTitle += "<span>"+ value + "</span><br/>";
          } else {
            newTitle += value + " ";
          }
        });
        $("h1 a", this).html(newTitle);
      });
    }

    find_and_add('.wrapper', 'BMW');
    find_and_add('.wrapper', 'Toyota');
    find_and_add('.wrapper', 'Ferrari');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="wrapper">

  <h1>
     <a href="#"> Brand name BMW </a>
  </h1>
  <h1>
     <a href="#"> Brand name Toyota </a>
  </h1>
  <h1>
     <a href="#"> Brand name Ferrari </a>
  </h1>

</div>

最佳答案

您的代码有很多问题。

您需要在班级名称前加点

find_and_add('.wrapper', 'BMW');

您正在传递父包装器，然后尝试以一种复杂的方式在一群孩子中找到一个特定的单词。为什么不按照以下示例传递父项​​和搜索项列表。

function find_and_add(element = "", findWords = "") {
      $(element).find("h1 a").each(function() {
       var $elem = $(this);
        var arr = $elem.text().split(' ');
        var newTitle = "";
        $.each(arr ,function(key, value) {
          if (findWords.indexOf(value)>-1) {
            newTitle += "<span>"+ value + "</span><br/>";
          } else {
            newTitle += value + " ";
          }
        });
        $elem.html(newTitle);
      });
    }

    find_and_add('.wrapper', ['BMW','Toyota','Ferrari']);

span{
  background-color:yellow
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="wrapper">

  <h1>
     <a href="#"> Brand name BMW </a>
  </h1>
  <h1>
     <a href="#"> Brand name Toyota </a>
  </h1>
  <h1>
     <a href="#"> Brand name Ferrari </a>
  </h1>

</div>