Question

你好开发人员，我试图用jQuery删除两个标签之间的某个字符：

<div class="product-details">
  <p class="product-name">Gastronormbehälter PROFI GN 1/6 - 150</p>
  <strong>1</strong> x
  <span class="price">9,14&nbsp;€</span>
</div>

在这种情况下，＆＃34; x＆＃34;强标记和span标记之间。我无法搜索＆＃34; x＆＃34;在产品详细信息类中，因为可能存在＆＃34; x＆＃34;以产品的名义。这就是为什么我认为应该删除<strong>和<span>之间的所有内容是最好的事情。

此外必须使用jQuery完成，我无法访问此代码以自行删除它。希望任何人都有解决方案，因为到目前为止我没有任何工作。

Answer 1

根据示例，您只需从.product-details div中删除所有子textNodes即可。您可以使用contents()，filter()然后remove()在jQuery中执行此操作：

＆＃13;

$('.product-details').contents().filter(function() {
  return this.nodeType == 3 && this.nodeValue.trim();
}).remove();

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="product-details">
  <p class="product-name">Gastronormbehälter PROFI GN 1/6 - 150</p>
  <strong>1</strong> 
  x
  <span class="price">9,14&nbsp;€</span>
</div>

＆＃13;

Answer 2

或者，您可以使用DOM关系来定位节点元素。在示例中，您可以获取对<strong>节点的引用，然后使用nextSibling获取所需元素

＆＃13;

var element = document.querySelector('.product-details > strong');
//element.nextSibling.nodeValue = "Modified Value";

element.nextSibling.parentNode.removeChild(element.nextSibling)

＆＃13;

<div class="product-details">
  <p class="product-name">Gastronormbehälter PROFI GN 1/6 - 150</p>
  <strong>1</strong> x
  <span class="price">9,14&nbsp;€</span>
</div>

＆＃13;

Answer 3

使用$('.product-details').children()获取带标记的元素。由于x没有任何标记，因此会将其删除。然后，将此结果设置为.product-details的新html内容。

＆＃13;

$('.product-details').html($('.product-details').children());

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="product-details">
<p class="product-name">Gastronormbehälter PROFI GN 1/6 - 150</p>
<strong>1</strong>
 x
<span class="price">9,14&nbsp;€</span>
</div>

＆＃13;

使用jQuery删除两个标记之间的文本

3 个答案: