Question

我想通过jQuery为字符串中的某个字符设置样式，但不知道如何处理它。我有以下情况

<a href="" accesskey="i">Link</a>

现在我想在可点击链接中为accesskey（在这种情况下为'i'）中的字符加下划线。所以'Link'中的'i'应加下划线

有人知道吗？

Answer 1

我自己的方法是：

$('a[accesskey]').each( //selects only those a elements with an accesskey attribute
    function(){
        var aKey = $(this).attr('accesskey'); // finds the accesskey value of the current a
        var text = $(this).text(); // finds the text of the current a
        var newHTML = text.replace(aKey,'<span class="access">' + aKey + '</span>');
        // creates the new html having wrapped the accesskey character with a span
        $(this).html(newHTML); // sets the new html of the current link with the above newHTML variable
    });

JS Fiddle demo

参考文献：

Answer 2

我用动态范围替换了“i”：

var jq = $('a');
var text = jq.text().replace(jq.attr('accessKey'), '<span style="text-decoration: underline;">i</span>');
jq.html(text);

http://jsfiddle.net/FishBasketGordo/QGEzA/

Answer 3

如果只是针对这种情况，我会在HTML中而不是在JQuery中执行：

<a href="" accesskey="i" style="text-decoration:none">L<u>i</u>nk</a>

注意：删除链接的默认下划线需要“text-decoration：none”，但您应该在CSS中设置它。

Here是这种方法的小提琴。

如果您仍想使用JQuery，可以将链接样式和内部html更改为上面的内容。

Answer 4

有一个名为“突出显示”的插件，它会根据搜索字符串突出显示一些文本。 Plugin here

有关使用说明，see this article。（我前段时间为Smashing写过）

为字符串中的某个字符设置样式

4 个答案: