Question

我需要定位最后一个<a>元素，但需要一些条件。在这种情况下，文本是通过CMS创建的，这限制了我添加课程的选项。我创建了一个jsfiddle来显示我的问题。最后一个<a>必须在其中具有字体真棒角度:after其他<a>元素不在其中。我无法使用:last-child a之类的内容，因为默认情况下用户/文本编写者不必编写链接。第一个之后还有可能有另一个段落。所以没有什么是默认值，但是段落中带有一些实际文本的最后一个<a>元素必须有一个图标。

有点难以解释，但是jsfiddle会解释自己所以请看看。如果有一个CSS解决方案会很好。如果不是jQuery排在第二位。

提前致谢！

Answer 1

据我所知，单独使用CSS无法完成。

JavaScript怎么样：

var element = document.getElementsByTagName("a");
for(var i=0; i < element.length; i++) {
    var el = element[i]
    var x = el.parentNode.innerText.length;
    var y = el.innerText.length
    if (x === y) {
        el.classList.add('icon');
    }
}

CSS：

.icon::after{
    content: "\f105";
    margin-left:5px;
    font-family: FontAwesome;
    background-color: transparent;
}

它为所有.icon元素添加了一个<a>类，这些元素没有与父元素中的文本内联包装。

Answer 2

您可以定位最后一个p代码。

p:last-of-type a::after{
  content: "\f105";
  margin-left:5px;
  font-family: FontAwesome;
  background-color: transparent;
}

使用条件

2 个答案: