CSS选择器选择文本中的所有相同字符?

时间:2015-07-23 00:42:03

标签: html css css-selectors

有没有办法在文本块中选择所有相同的字符。例如,如果我想让我的文本中的所有a都变成红色。我可以在一个跨度中包装它们并做...

... Hello tod<span class="red">a</span>y is mond<span class="red">a</span>y ...

CSS

.red{
     color:red;
}

但这需要很长时间而且难以维持。

我正在寻找类似的东西

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque auctor purus sed 
consequat maximus. Curabitur nunc nulla, volutpat accumsan aliquet eget, eleifend a 
leo. Pellentesque quis feugiat erat, vel cursus enim. Sed viverra mollis luctus. Proin 
ac lacus nulla. Fusce tincidunt, mauris vitae pulvinar pellentesque, lacus nisi sagittis
 mauris, vel luctus sapien dolor a ex. Donec dictum dui vitae pellentesque lacinia. Vivamus 
mattis venenatis varius.</p>

和css

p "a"{
    color: red;
}

谢谢!

2 个答案:

答案 0 :(得分:1)

使用纯CSS我认为不可能实现这一点。

许多JavaScript支持突出显示:

答案 1 :(得分:0)

如果您决定使用Javascript,则可以轻松使用替换(&#34; a&#34;,&#34; ...&#34;)方法。

var icon;

$(document).ajaxStart(function() {
    if (icon) {
        icon.show();
    }
});

$('button[name=act]').click(function() {
    icon = $(this).closest('div.thumbnail').find('i');
});

$("form").submit(function (e) {
    e.preventDefault();
    var formData = new FormData($(this)[0]);
    $.ajax({
        url: "ajax/acttdb",
        data: formData,
        dataType: "json",
        type: "POST",
        cache: false,
        contentType: false,
        processData: false,
        success: function (data, status, jqXhr) {
            if (icon) {
                icon.fadeIn(function() {
                    $(this).removeClass('fa-spinner fa-spin').addClass('fa-check text-success').fadeOut(1000, function() {
                        $(this).removeClass('fa-check text-success').addClass('fa-spinner fa-spin');
                    });
                });
            }
        }/*,
           error: function (jqXhr, textStatus, errorThrown) {
           console.log("Error response:", jqXhr.responseText);
           }*/
    });
});