javascript截取字符串的方法 js截取第一个字符串
平时前端开发工作时，经常会需要对字符串进行截断，比如新闻标题，需要把超出可视区域后需要进行截断，如下图：
文章插图
小编我由主要负责后端开发，最开始是采用后端方法来实现字符串截断，然后传递给前端人员使用 。
但是这个方式有一个弊端，尤其是响应式的页面，截取字数无法精确控制，比如pc端可视区域可以显示150个字符，但是手机端屏幕最多只能显示20个字符，所以通过后端来控制字符数是非常烂的解决方案，最好的解决办法是通过前端方式来截断字符串，下面分别用javascript和css的方式来实现 。
先看一下html部分
<div class="title">为什么要制作高端的网站？高端网站建设价格为什么越来越高？</div>下面分别针对这行html进行截断操作 。
1、javascript方式 。先封装一个截取字符串的方法，代码如下：
<script>String.prototype.left = function (len) //左边截取字段数{ var str = this; if (isNaN(len) || len == null) { len = str.length; } else { if (parseInt(len) < 0 || parseInt(len) > str.length) { len = str.length; } } return str.substr(0, len);}</script>然后再页面中采用jquery方式调用：
<script type="text/javascript"> $(function () { var $title=(".title"); var txt= $title.html().left(50); //截取前50个字符 $title.html(txt); //重新 });</script>这种方式可以实现字符串的截取，但是这种方法也不理想，pc端和手机端截取字数还是需要单独根据浏览器类型来定义 。
2、css控制，这个是最推荐的解决方案定义一个css类：
.title { white-space: nowrap; text-overflow: ellipsis;overflow: hidden;}text-overflow: ellipsis; 这句意思是超出可视区域后显示三个点…，如果只想截断，可以改为： text-overflow:clip 。
【javascript截取字符串的方法 js截取第一个字符串】今天先写到这里，如果感觉对您有帮助，可以转发一下，后续有时间再分享一下前端技巧给大家 。
推荐阅读
- js在for循环中使用java代码 javascript遍历对象
- java冒泡排序 javascript的全局函数有哪些
- sql中substring的用法 substring截取字符串
- javascript原型和原型链 js全局函数有哪些
- javascript网页代码大全 js网页设计源码
- mysql批量替换字符串 mysql批量修改数据
- 教你javascript实时获取鼠标位置 js获取鼠标点击的位置
- php分割字符串为数组 php获取字符串第一个字符
- goldwave截取片段方法 goldwave中文使用教程
- 截取mp3音乐软件推荐 音乐切割器怎么用