У меня есть много строк, разделенных запятыми, каждая из которых состоит из списка тегов, и я хочу стилизовать каждый тег внутри блока ( см. Здесь ).
Я преобразовал каждую строку, разделенную запятыми ("p"), в массив, затем обернул <span>
теги вокруг каждого значения в массиве, так что я мог оформить его с помощью CSS, который отлично работал.
Но строки пробелов также оборачиваются в теги span, которые я не хочу, я хочу игнорировать их (или скрывать).
Как мне игнорировать те вхождения "p", которые содержат только пробел? Ответы здесь и здесь , но у меня не сработали.
HTML:
<p>Skill 1, Skill 2, Skill 3</p>
<p>Skill 1</p>
<p> </p>
Javascript:
$("p").each(function() {
var words = $(this).text().split(", ");
var total = words.length;
$(this).empty();
for (index = 0; index < total; index++) {
$(this).append($("<span class = 'tag' > ").text(words[index]));
}
})
CSS:
.tag {
background-color: lightgray;
padding: 3px;
margin: 3px;
border-radius: 3px;
}
JS Скрипка