时间戳

首页 > 解决方案 > 通过标签获取并添加标签

jquery - 通过标签获取并添加标签

问题描述

我目前正在使用 Wordpress，我有这个 html 代码：

<div class="single-price-wrapper">
     <p class="price">
        <del><span class="woocommerce-Price-amount amount">989.00&nbsp;<span class="woocommerce-Price-currencySymbol">лв.</span></span></del> 
        <ins><span class="woocommerce-Price-amount amount">239.00&nbsp;<span class="woocommerce-Price-currencySymbol">лв.</span></span></ins>
     </p>
</div>

我无法在行上添加或编辑类名或 ID。如何在标签中和价格之前捕捉价格以添加“价格”等标签并在标签中捕捉价格以及在此价格之前附加标签“真实价格”？

标签： jquery

解决方案

CSS 规则在内容之前使用

.price > * > span:before {
  content: "Price "
}
<div class="single-price-wrapper">
     <p class="price">
        <del><span class="woocommerce-Price-amount amount">989.00&nbsp;<span class="woocommerce-Price-currencySymbol">лв.</span></span></del> 
        <ins><span class="woocommerce-Price-amount amount">239.00&nbsp;<span class="woocommerce-Price-currencySymbol">лв.</span></span></ins>
     </p>
</div>

如果你想用 JavaScript 注入它

$(".price > * > span").before("<label>Price: </label>")
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="single-price-wrapper">
     <p class="price">
        <del><span class="woocommerce-Price-amount amount">989.00&nbsp;<span class="woocommerce-Price-currencySymbol">лв.</span></span></del> 
        <ins><span class="woocommerce-Price-amount amount">239.00&nbsp;<span class="woocommerce-Price-currencySymbol">лв.</span></span></ins>
     </p>
</div>

推荐阅读