最近绩效里面添加了一个技术评价，其中里面的考核题是使用JS截取字符串截取指定字符串。
这个是我公司里面得到第一名的代码。不过我的js水平好差，但是我在他的代码中学到了一些新的东西。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="./jquery.js"></script>
<script type="text/javascript">
$(function(){
var div = $(".div");
var font_s = parseInt(div.css("font-size"));
var line_h = parseInt(div.css("line-height"));
var div_h = div.height();
var div_w = div.width();
var len = Math.floor(div_w/font_s);
var con = div.text();
var con2 = con;
var con_new = Math.floor(div_h/line_h);
con2 = con2.replace(con2.substring(len*(con_new-1)+6,con2.length),"...");//替换
div.text(con2)
$(".radio").click(function(){
$(this).attr("checked","checked").siblings().removeAttr("checked");
div.height(this.value);
div_h = div.height();
var con_new = Math.floor(div_h/line_h);
//alert(div_h + "====" + con_new)
//con3 = con.replace(con.substring(len*(con_new-1)+5,con.length),"...");//替换
//div.text(con3)
con3 = con.substring(0,len*(con_new-1)+6);//截取
div.text(con3 + "...")
})
//con = con.substring(0,len*(con_new-1)+5);//截取
//div.text(con + "...")
})
</script>
<style>
*{margin:0; padding:0}
html{ font-size:14px;}
.div0{ margin:30px;}
.div{ width:300px; height:80px; line-height:24px; border:1px solid #333; margin:30px; padding:5px; }
</style>
</head>
<body>
<div class="div0">
点击修改高度：
<input type="radio" class="radio" value="50">50px
<input type="radio" class="radio" value="80">80px
<input type="radio" class="radio" value="110">110px
<input type="radio" class="radio" value="140">140px
</div>
<div class="div"> 这是一种土方法，小时候常玩儿。背靠墙或椅背，以头枕部向后顶墙，头和身体不动，肌肉紧张收缩，后来听人说这叫"绷劲儿”；或者双手交叉放在头枕部，双手向前使劲儿，头枕部向后使劲儿，相互对抗，头颈不动。锻炼时，颈项部的肌肉持续紧张3—5秒，放松休息3—5秒为1个周期。每天锻炼100—200次，分5—10组完成。
</div>
</body>
</html>
本文出自 “前端” 博客，请务必保留此出处http://xhlsky.blog.51cto.com/9087386/1857331
原文地址：http://xhlsky.blog.51cto.com/9087386/1857331
