Question

我正在使用博客来创建帖子，帖子布局如下：

帖子标题

标签

内容

作者

创建包含多个标签的帖子时，它们会显示如下：

标签：另类，新音乐，想象龙？

我的问题是，在这种情况下，我怎么能只显示“类型”“替代”，所以它会显示如下：

标签：替代

Blogger不支持php所以这必须要完成我相信JavaScript / jQuery我可以过滤标签div内的文本。但是我不是很熟练。

更新非常感谢Chirag64！任何使用博客的人都会发现这在选择要在帖子上显示的某些标签时非常有用。

最终产品可以在这里查看：

jsfiddle.net/3apZ4/13 /

Answer 1

您可以使用css和jquery来完成。

1）首先将每个标签与单独的div分开

2）为css中的类创建一个样式，如

    .hidden-class
    {
        display:none;
    }

在jquery中，在某些条件下将隐藏类添加到div。

      $( "id" ).addClass( "hidden-class" );

如果你想删除

      $( "id" ).removeClass( "hidden-class" );

在javascript中添加

        document.getElementById('id').className += 'hidden-class'

删除

       document.getElementById("id").className = document.getElementById("id").className.replace(/\bhidden-class\b/,'');

Answer 2

您可以使用以下JavaScript代码删除除第一个类型之外的其他类型。

//Remove genres not matching the listOfGenres list
var labels = document.querySelectorAll(".post-labels a");
var listOfGenres = ["Alternative","Pop"];

for (i=0; i < labels.length; i++) {
    if (listOfGenres.indexOf(labels[i].textContent) == -1)
        labels[i].remove();
}

//Remove trailing commas.
var postLabels = document.querySelector(".post-labels");
postLabels.innerHTML = postLabels.innerHTML.replace(/\,/g, "");

Working JSFiddle

如何在div中只显示某些文本？

2 个答案: