jquery - 在访问链接后添加 FontAwesome 图标

Question

我想在用户访问过我网站的每个链接后添加一个简单的勾选图标。

到目前为止，这是我尝试过的:

CSS

.accomm-panel:visited h5:after {
    content: "\f00c";
    color: #80b54d;
}

注意:“.accomm-panel”类是 anchor 链接。我只想定位访问过的链接并查找 h5 元素并附加图标。

JS

$('.accomm-panel:visited h5').after('<i class="fa fa-check fa-1"></i>');

HTML

<a href="http://localhost/gbtc/accommodation/029gb-step-back-in-time/?_sfm_low_season_fee=0+10000" class="accomm-panel">
    <div class="img-container" style="background-image: url('http://localhost/gbtc/wp-content/uploads/2015/05/gordons-bay-harbour-wall-sunset.jpg');">
        <div class="price">
            <p>From</p>
            <p class="amount">R</p>
        </div>
    </div>
    <div class="panel-content">
        <h5>Step Back in Time</h5>                                                                                           
        <p class="description">1 Guest • 12 Bedrooms • 12 Bathrooms • 029GB</p>
    </div>
</a>

这两种方法都行不通。 This article概述，由于用户隐私问题，文章中的建议不太可能奏效。

我想知道这些问题是否有解决方法。

Answer 1

你必须像这样为“:after”伪元素指定字体系列:

.accomm-panel:visited h5:after {
    font-family: FontAwesome;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}