在javascript中查找并替换单词

Find and replace word in javascript

本文关键字：替换 单词 查找 javascript      更新时间：2023-09-26

我正在尝试在Javascript中查找和替换单词，html结构无法更改，所以我只能使用JS进行更改，不能使用jQuery，但使用Javascript不太好：

HTML结构如下：

<a id="ys-cc-tablink">
  <em>
     <img src="card.jpg">
     <span>&nbsp;Credit / Debit Card</span>
  </em>
</a>

我正试图用标题替换信用卡/借记卡支付我尝试过的内容如下，并且运行良好：

$("#ys-cc-tablink > em > span").each(function() {
   var text = $(this).text();
   $(this).text(text.replace(' Credit / Debit Card', 'Payment')); 
});

但我需要Javascript而不是jQuery，有人能帮忙吗？

感谢

更新：

 var str = document.getElementById("demo").getElementsByTagName("span")[0].innerHTML; 
 var res = str.replace("Credit / Debit Card", "Payment");
 document.getElementById("ys-cc-tablink").getElementsByTagName("span")[0].innerHTML = res;

您可以使用querySelectorAll获取所有元素，循环遍历它们，并检查要替换的文本是否存在，然后替换它：

var spans = document.querySelectorAll('#ys-cc-tablink span');
for(var i=0;i<spans.length;i++){
    var span_text = spans[i].innerText;
    if(span_text.indexOf('Credit / Debit Card') != -1)
        spans[i].innerText = span_text.replace("Credit / Debit Card", "Payment");
}

希望这能有所帮助。

var spans = document.querySelectorAll('#ys-cc-tablink span');
for(var i=0;i<spans.length;i++){
  var span_text = spans[i].innerText;
  if(span_text.indexOf('Credit / Debit Card') != -1)
    spans[i].innerText = span_text.replace("Credit / Debit Card", "Payment");
}
<a id="ys-cc-tablink">
  <em>
     <img src="">
     <span>&nbsp;My Credit / Debit Card</span><br>
     <span>&nbsp;test</span><br>
     <span>&nbsp;Credit / Debit Card and some extra text</span>
  </em>
</a>

这给出了元素引用：

var elem = document
  .getElementById("ys-cc-tablink")
  .getElementsByTagName("em")[0]
  .getElementsByTagName("span")[0];

替换代码块：

elem.innerHTML.replace("Credit / Debit Card", "Payment")


var elem = document
  .getElementById("ys-cc-tablink")
  .getElementsByTagName("em")[0]
  .getElementsByTagName("span")[0];
elem.innerHTML = elem.innerHTML.replace("Credit / Debit Card", "Payment");
<a id="ys-cc-tablink">
  <em>
     <img src="card.jpg">
     <span>&nbsp;Credit / Debit Card</span>
  </em>
</a>

我猜您的问题与不间断空间&nbsp;实体有关。但是，如果您无论如何都要替换整个文本，为什么不使用$(this).text('Payment')呢？

作为参考，NBSP可以在JavaScript中表示为'u00A0。所以你可以做$(this).text(text.replace(''u00A0Credit / Debit Card', 'Payment'));

在没有jQuery的情况下，使用element.innerHTML = element.innerHTML.replace('...', '...');或element.textContent = ...

相关文章：