javascript 或 css : How to Hide any Number followed by dot Prefix "1.text", "2.text".. ."30.text"来自标签内的文本

Question

我想用 javascript 或 css 隐藏标签内文本的所有(数字后跟点)前缀。 隐藏“1.”、“2..”...“30.”来自标签文本的“1.text”、“2.text”...“30.text”。

HTML
<li>
<label class="layered_nocolor">
1.alpha
</label>
</li>
<li>
<label class="layered_nocolor">
2.beta
</label>
</li>
<li>
<label class="layered_nocolor">
30.gama
</label>
</li>

我希望我的页面显示没有前缀的文本

alpha
beta
gama

Answer 1

您将无法使用 CSS OR Javascript 隐藏任何内容。你将需要他们两个。您将不得不使用 CSS 来隐藏标签和 Javascript 来动态地改变标签的样式。首先，创建一个名为 hide 的 CSS 类:

.hide{
   display: none;
 }

然后，在您的 HTML 中，您将添加此脚本:

// Gets all your HTML element with the class "layered_nocolor".
var labels = document.getElementsByClassName("layered_nocolor");
// The regex pattern you want to hide. It means "one or more digit before a dot".
var pattern = "(/d+\.)";
// Iterates all the elements you got from before. 
for(int i = 0; i < labels.length; i++){
  // If your label match the regex pattern you change the class hiding it.
  if(labels[i].innerHTML.match(pattern) != null){
    labels[i].class = "layered_nocolor hide";
  }
}

编辑

经过您的解释，这是您要查找的代码:

// Gets all your HTML element with the class "layered_nocolor".
var labels = document.getElementsByClassName("layered_nocolor");
// The regex pattern you want to hide. It means "one or more digit before a dot".
var pattern = "(/d+\.)";
// Iterates all the elements you got from before. 
for(int i = 0; i < labels.length; i++){
  // If your label match the regex pattern you replace the text with "" to remove it.
 (labels[i].innerHTML.replace(pattern, "");
}

编辑 2

如果您正在使用 jQuery，这是最好的方法:

$(".layered_nocolor").html(function(i, oldhtml){return oldhtml.replace(/\\d+\\./, "");});

双“\”很重要，因为如果只插入一次，它将用作转义字符而不是文字。