在前n个字符下划线

Question

我想在链接中强调单词的前几个字符，类似于CSS第一个字母的工作方式，但字母数量可变。 或者，强调单词字母的前半部分可能很有用。 用HTML，CSS或Javascript相对简单的方法吗？

（我不是开发人员，并且对所有人和所有建议都持开放给开发团队;）

Answer 1

<a href="#" class="underline">This is text.</a><br/>
<a href="#" class="underline">More text.</a><br/>
<a href="#" class="">No underline.</a><br/>
<a href="#" class="underline">Underline me.</a><br/>
<a href="#" class="">Nada here though.</a><br/>

a,
a.underline {
    text-decoration: none;
}
.underline span {
    color: green;
    text-decoration: underline;
}

var links = document.links;
var chars = 3;

for (var i = 0, total = links.length; i < total; i++) {
    if (links[i].className.indexOf('underline') > -1) {
        var text = links[i].innerHTML;
        text = '<span>' +
            text.substring(0, chars) +
            '</span>' +
            text.substring(chars);
        links[i].innerHTML = text;
    }
}

http://jsfiddle.net/hMEHB/

编辑：单词。

var links = document.links;
var chars = 3;

for (var i = 0, total = links.length; i < total; i++) {
    if (links[i].className.indexOf('underline') > -1) {
        var text = links[i].innerHTML.split(' ');
        for (var p = 0, words = text.length; p < words; p++) {   
            text[p] = '<span>' +
                text[p].substring(0, chars) +
                '</span>' +
                text[p].substring(chars);
        }
        links[i].innerHTML = text.join(' ');
    }
}

http://jsfiddle.net/hMEHB/1/

编辑 ：作为一个功能。

var links = document.links;
var chars = 2;

for (var i = 0, total = links.length; i < total; i++) {
    if (links[i].className.indexOf('underline') > -1) {
        setUnderline(links[i], chars);
    }
}

function setUnderline(link, chars) {
    var text = link.innerHTML.split(' ');
    for (var p = 0, words = text.length; p < words; p++) {   
        text[p] = '<span>' +
            text[p].substring(0, chars) +
            '</span>' +
            text[p].substring(chars);
    }
    link.innerHTML = text.join(' ');
}

http://jsfiddle.net/hMEHB/2/

Answer 2

你可以简单地把̲ 在任何单词之后它变为下划线，它是一个HTML代码。

<input type=button value=S&#818;end>

它成为了：

发送

但您可以创建一个JavaScript函数来为您完成，请参阅：

function underlineWord(pos,str){
  str = str.substring(0,pos) + str[pos] + "̲" + str.substring(pos+1,str.length);
  return str;
}

这样，如果你执行：

underlineWord(0,"string");

您将拥有：

串

Answer 3

我不确定您是否尝试替换链接中的前N个字母或链接中每个单词的前N个字母。 如果是后者，请尝试替换正则表达式

new RegExp("\b\w{1," + N + "}", "g")

用适当的替代品如

function(a) { return "<u>" + a + "</u>"; }

这是一个例子：

http://jsfiddle.net/AZpG7/