如何删除span中的连字符？ （jQuery的）

Question

我有面包屑，在特定链接中生成连字符。

>> arr = np.array([1, 2])

>> padpad(arr, 1)
Out[2]: array([0, 1, 2, 0])

>> len(padpad(arr, 1)
Out[3]: 4

>> padpad(arr, 5)
Out[4]: array([0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
       0, 0, 0, 0, 0, 0, 0, 0, 1, 2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
       0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0])

>> len(padpad(arr, 5))
Out[5]: 32

>> padpad(arr, 8)
Out[6]: array([0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 1, 2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
   0, 0, 0, 0, 0, 0])

我想删除class =“post post-vehicle-archive”中的内容。

这是我到目前为止尝试的代码：

<div class="breadcrumbs">
   <span class="home">
        <a href="#"><span property="name">Home</span></a>
   </span>

   <span>
        <a href="#" class="post post-vehicle-archive"><span property="name">books-for-sale</span></a>
   </span>

   <span>
        <a href="#" class="book-name"><span property="name">Soup for the sould</span></a>
   </span>
</div>

结果应为“待售书籍”

感谢任何帮助。

Answer 1

尝试使用.text()

的接收器功能

var getTermName = j('.breadcrumbs .post.post-type-archeive > span');
getTermName.text(function(i,value) {
  return value.replace(/\-/g, " ")
});

如果您想将文字更改为标题案例，请使用以下代码

var getTermName = j('.breadcrumbs .post.post-type-archeive > span');
getTermName.text(function(i,value) {
  return value.replace(/\-/g, " ").split(" ").map(function(function(val){
     return val.charAt(0).toUpperCase() + val.slice(1);
  }).join(" ");
});

或者不要让事情变得复杂，

JS：

var getTermName = j('.breadcrumbs .post.post-type-archeive > span').addClass("titleCase");
getTermName.text(function (i, value) {
    return value.replace(/\-/g, " ")
});

CSS：

.titleCase {
    text-transform: capitalize;
}

Answer 2

使用text()回调来更新所有元素的innerText。

1. 迭代所有面包屑
2. 删除连字符，并将每个单词大写的第一个字符
＆＃13;
＆＃13;
var j = jQuery.noConflict();
j(function() {
  // This will loop over all the matched `<a>` elements
  // Corrected selector
  j('.breadcrumbs span a').text(function(i, oldText) {

    //     To capitalize the first character of first word
    return oldText[0].toUpperCase() + oldText.substring(1).replace(/-[a-z]/g, function(m) {

      // Add space and capitalize the first character
      return ' ' + m[1].toUpperCase();
    });
  });
});
＆＃13;
a {
  margin: 5px;
  text-decoration: none;
}
＆＃13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="breadcrumbs">
  <span class="home">
    <a href="#"><span property="name">Home</span>
  </a>
  </span>

  <span>
    <a href="#" class="post post-vehicle-archive"><span property="name">books-for-sale</span>
  </a>
  </span>

  <span>
    <a href="#" class="book-name"><span property="name">Soup for the sould</span>
  </a>
  </span>
</div>
＆＃13;
＆＃13;
＆＃13;

正则表达式说明：

1. -：字面上匹配连字符。在Character Class
之外使用时无需转义
2. [a-z]：匹配单个小写字母
3. g：全局标志，用于匹配所有可能的匹配。

注意：如果您想要将空格分隔的面包屑大写，请使用以下正则表达式

/[-\s][a-z]/g