时间戳

首页 > 解决方案 > 获取每个列表元素的最后 3 个字符并使用 Javascript 将其更改为 #

javascript - 获取每个列表元素的最后 3 个字符并使用 Javascript 将其更改为 #

问题描述

我在 HTML 上有一组电话号码列表。我需要用### 替换每最后 3 位数字。

使用纯 Javascript 执行此操作的最佳方法是什么？

<ul>
  <li>
      <dl>
        <dt>Phone:</dt>
        <dd class="phone">333444555</dd>
      </dl>
  </li>
  <li>
      <dl>
        <dt>Phone:</dt>
        <dd class="phone">777888999</dd>
      </dl>
  </li>
</ul>

预期的结果应该是这样的

<ul>
  <li>
      <dl>
        <dt>Phone:</dt>
        <dd class="phone">333444###</dd>
      </dl>
  </li>
  <li>
      <dl>
        <dt>Phone:</dt>
        <dd class="phone">777888###</dd>
      </dl>
  </li>
</ul>

感谢所有答案..

干杯

标签： javascripthtml

解决方案

您可以使用querySelectorAll()“电话”类获取所有元素，然后通过使用循环遍历它们返回一个没有最后 3 个字符的新字符串String.prototype.slice()，最后连接###：

var phones = document.querySelectorAll('.phone');
phones.forEach(function(p){
  var t = p.textContent;
  p.textContent = t.slice(0, -3) + '###';
});
<ul>
  <li>
      <dl>
        <dt>Phone:</dt>
        <dd class="phone">333444555</dd>
      </dl>
  </li>
  <li>
      <dl>
        <dt>Phone:</dt>
        <dd class="phone">777888999</dd>
      </dl>
  </li>
</ul>

推荐阅读