将 Class 名称更改为 jQuery 或 CSS

Question

所以我正在尝试将我网站上的这部分代码从 'products' 更改为 'shop'

_{问题的图像以红色突出显示：}

<strong class="breadcrumb_last">Products</strong>

面包屑中的产品文本是从 >Products< 部分提取的，因为当我将其更改为 'Shop' 时，它在网站的面包屑中进行了更改。

我需要一种使用 CSS 或 jQuery 将其编码到我的网站的方法，因为这是一个 wordpress 网站，所以它会更改

<strong class="breadcrumb_last">Products</strong>

到

<strong class="breadcrumb_last">Shop</strong>

有什么想法吗？

谢谢，

哈维

[]

2[]3

Answer 1

使用现有的 HTML，我建议您使用以下代码：

  $(".breadcrumb_last").text("Shop");

不过，如果元素有一个ID会更好，因为碰撞（更新很多元素）的机会会更低。如果你决定给你的元素一个 ID，下面的代码会很有用。

  $("#name-of-element").text("Shop");

JSfiddle 示例：https://jsfiddle.net/9k8h53t9/

Answer 2

不要使用$(".breadcrumb_last")作为选择器。
在其他页面上，您的 .breadcrumb_last 可能不包含所需的 Products 文本 ^{（参见 ex.2）}

而不是，以parent选择器为目标（在您的特定情况下为#breadcrumbs），然后选择a, strong children - 为了确保您没有更改任何其他内容 - 但具有 "Products" 字符串的元素。方法如下：

jQuery(function($) { // DOM ready and $ alias secured

  $("#breadcrumbs").find('a, strong').text(function(idx, txt) {
    if (txt === "Products") return "Shop";
  });

});

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


<p id="breadcrumbs">

  EXAMPLE 1<br><br>

  <span>
    <span>
      <a href="#!">Home</a>
      &raquo;
      <strong class="breadcrumb_last">Products</strong>
    </span>
  </span>

  <br><br> EXAMPLE 2<br><br>

  <span>
    <span>
      <a href="#!">Home</a>
      &raquo;
      <a href="#!">Products</a> 
      &raquo;
      <strong class="breadcrumb_last">This is a product 1</strong>
    </span>
  </span>

</p>

同样，您可以使用 :contains("Products")，但这也会像 <a>Dangerous Products</a> 那样以 children 为目标 - 这显然是一件危险的事情:)

将 Class 名称更改为 jQuery 或 CSS

Change Class Name with jQuery or CSS

css

wordpress

jquery

element

class