首页 > 解决方案 > 使用 JQuery 隐藏字符串开头的文本

问题描述

我有一个网络托管软件,我需要在我的字符串开头公开某种排序值,以使项目以正确的顺序出现。该软件将自动按字母顺序对值进行排序,因此我计算了一个排序值,现在输出按年龄顺序很好地排序,如下所示:

我想允许软件使用这些值对值进行排序,但我希望浏览器只实际显示人名:

我想知道是否可以在 JQuery 中编写一个脚本来侦听包含“Years Old”的文本,然后将前 14 个字符从显示中删除,例如类似

$(".DIV:contains(' Years Old ')").html(
  //Here I would like to show only the text after the first 14 characters
);

如果有人对如何实现上述目标有任何想法或对如何实现它有更好的想法,那么我将非常感谢您的意见!

标签: javascriptjquery

解决方案


要从div文本中删除前 14 个字符,您可以提供一个text()接受当前文本值作为参数的函数。然后您可以使用substring()删除前 N 个字符并返回结果来更新元素。试试这个:

$('div').text((i, t) => t.substring(14));
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>001 Years Old David</div>
<div>033 Years Old Annabelle</div>
<div>055 Years Old Carol</div>
<div>065 Years Old Bill</div>

然而值得注意的是,这不是一个最佳解决方案。data假设可能,更好的方法是将排序索引放入div. 然后,您可以简单地订购,而不必担心事后修改文本。像这样的东西:

$('#container div').sort((a, b)  => $(a).data('order') < $(b).data('order') ? -1 : 1).appendTo('#container');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="container">
  <div data-order="65">Bill</div>
  <div data-order="55">Carol</div>
  <div data-order="1">David</div>
  <div data-order="33">Annabelle</div>
</div>


推荐阅读