01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8">
<metaname="author"content="
http://www.softwhy.com/"/>
<title>蚂蚁部落</title>
<scripttype="text/javascript"src="mytest/jQuery/jquery-1.8.3.js"></script>
<scripttype="text/javascript">
$.fn.extend({
displayPart:function(){
vardisplayLength=100;
displayLength=this.attr("displayLength")||displayLength;
vartext=this.text();
if(!text)return"";
varresult="";
varcount=0;
for(vari=0;i<displayLength;i++){
var_char=text.charAt(i);
if(count>=displayLength)break;
if(/[^x00-xff]/.test(_char))count++;
result+=_char;
count++;
}
if(result.length<text.length){
result+="...";
}
this.text(result);
}
});
$(function(){
$(".displayPart").displayPart();
});
</script>
</head>
<body>
<divclass="displayPart"displayLength="20">蚂蚁部落欢迎您，只有努力奋斗才会有美好的未来。</div>
</body>
</html>
以上代码实现了我们的要求，下面介绍一下它的实现过程。
一.代码注释:
（1）.$.fn.extend({})，为jQuery对象实例添加对象。
（2）.displayPart:function(){}，设置对象的属性，属性值是一个函数，实现截取字符串功能。
（3）.vardisplayLength=100，默认的截取长度为100。
（4）.displayLength=this.attr("displayLength")||displayLength，如果设置了截取长度则使用此值，否则使用默认值。
（5）.vartext=this.text()，获取元素中的文本内容。
（6）.if(!text)return""，如果文本内容为空则返回一个空字符。
（7）.varresult=""，此变量用来存储截取结果。
（8）.varcount=0，此变量用来作为标识，存储当前字符串的长度。
（9）.for(vari=0;i<displayLength;i++)，遍历字符串中的字符，displayLength是要截取的长度。
（10）.var_char=text.charAt(i)，获取指定位置的字符。
（11）.if(count>=displayLength)break，count的值大于displayLength，就说明超出长度了，于是跳出循环。
（12）.if(/[^x00-xff]/.test(_char))count++，判断当前字符是否是双字节的，如果是先将count加1，因为后面还要加1，所以是将双字节按照占2个长度处理。
（13）.result+=_char，连接字符串。
（14）.count++，对count进行加1操作。
（15）.if(result.length<text.length){result+="...";}，截取长度小于字符串实际长度，后面跟有省略号。
（16）.this.text(result)，写入截取后的字符串。
二.相关阅读:
（1）.attr()参阅jQueryattr()方法一章节。
（2）.text()参阅jQuerytext()方法一章节。
（3）.charAt()参阅JavaScriptcharAt()方法一章节。
（4）.break语句参阅JavaScriptbreak与continue语句一章节。
（5）.test()参阅正则表达式test()一章节。
如果您觉得本文的内容对您的学习有所帮助：
关键字：
jQuery