如何使用css选择其中没有跨度的标签标签

Question

是否可以使用CSS定位所有没有跨度的标签标签：

<label><span></span>foo</label>    <-- don't target this one
<label>bar</label>                 <-- do target this one

Answer 1

您可以尝试使用:empty伪选择器。

label:empty{//some css here}

如果你想定位它们以便修改内容，你应该使用JavaScript，比如这个jQuery代码：

$('label:empty').html('Your added html content here');

Answer 2

  

我在想我可能不得不使用jQuery，所以我的定位问题也会有所帮助。

使用jQuery，您可以遍历每个label，过滤掉任何包含span元素的内容。为此，我们可以使用jQuery's filter() method：

  

此方法的第二种形式[filter]允许我们针对函数而不是选择器过滤元素。对于每个元素，如果函数返回true（或“truthy”值），则该元素将包含在过滤集中;否则，它将被排除在外。

$('label').filter(function() {
    return $(this).children('span').length == 0;
});

这会选择所有label元素（$('label')），然后使用filter()对它们进行迭代，以确保找不到子span个元素（如果有子span 1}}元素，length属性将等于匹配数。）

Answer 3

这取决于你定位后想要做什么。

如果您想定位跨度之外的文字，那么您可以执行类似

的操作

label { color: red; }
label span { all: initial; }

但我不知道这是否能解决你的问题，甚至是你的问题。