HTML长文本截取含有HTML代码同样适用的两种方法


Posted in Javascript onJuly 31, 2013

方法一:用CSS截断字符串:IE,FireFox,Opera ,Safari都兼容

.subLongText{ 
width:150px; 
height:24px; 
overflow:hidden; 
white-space:nowrap; 
text-overflow:ellipsis; 
text-overflow: ellipsis;/* IE/Safari */ 
-ms-text-overflow: ellipsis; 
-o-text-overflow: ellipsis;/* Opera */ 
-moz-binding: url("ellipsis.xml#ellipsis");/*FireFox*/ 
} 
<span class="subLongText">任意长度文本</span>

方法二:用js截取
<HTML> 
<HEAD> 
<TITLE>JQUERY 文本截取方法</TITLE> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
<script type="text/javascript" src="jquery-1.3.2.js"></script> 
<script type="text/javascript"> 
$.fn.substr = function(length,content){ 
$(this).each(function(i,item){ 
var val=$(item).html(); 
if(!val) return; 
if(val.length>length) { 
val = val.substring(0,length); 
val += content || "..." 
$(item).html(val); 
} 
}); 
} 
function subTdContent(){ 
$('td').substr(20); 
} 
</script> 
</HEAD> 
<BODY onload="javascript:subTdContent();"> 
<table style="border:1px solid #b3c0f5;" border="1"> 
<tr> 
<td>我是代码:$.fn.substr = function(l,c){ $(this).each(function(i,item)</td> 
<td>以下两种方式都可以解决textarea行高自动适应类容的高度</td> 
<td>以下两种方式都可以解决textarea行</td> 
</tr> 
</table> 
</BODY> </HTML>
Javascript 相关文章推荐
讲两件事:1.this指针的用法小探. 2.ie的attachEvent和firefox的addEventListener在事件处理上的区别
Apr 12 Javascript
window.parent与window.openner区别介绍
Apr 12 Javascript
jQuery中 noConflict() 方法使用
Apr 25 Javascript
javascript列表框操作函数集合汇总
Nov 28 Javascript
举例讲解jQuery对DOM元素的向上遍历、向下遍历和水平遍历
Jul 07 Javascript
JavaScript中日期函数的相关操作知识
Aug 03 Javascript
利用javascript实现的三种图片放大镜效果实例(附源码)
Jan 23 Javascript
详解webpack自动生成html页面
Jun 29 Javascript
详解Vue双向数据绑定原理解析
Sep 11 Javascript
详解javascript中的变量提升和函数提升
May 24 Javascript
Vue 组件复用多次自定义参数操作
Jul 27 Javascript
GitHub上77.9K的Axios项目有哪些值得借鉴的地方详析
Jun 15 Javascript
JS的千分位算法实现思路
Jul 31 #Javascript
一个JS的日期格式化算法示例
Jul 31 #Javascript
jquery实现div拖拽宽度示例代码
Jul 31 #Javascript
JS 获取浏览器和屏幕宽高等信息的实现思路及代码
Jul 31 #Javascript
javascript获取下拉列表框当中的文本值示例代码
Jul 31 #Javascript
禁用页面部分JavaScript方法的具体实现
Jul 31 #Javascript
jquery 单引号和双引号的区别及使用注意
Jul 31 #Javascript
You might like
SONY SRF-M100的电路分析
2021/03/02 无线电
浅谈php自定义错误日志
2015/02/13 PHP
基于JQuery的一句代码实现表格的简单筛选
2010/07/26 Javascript
分析Node.js connect ECONNREFUSED错误
2013/04/09 Javascript
js拖拽一些常见的思路方法整理
2014/03/19 Javascript
什么是cookie?js手动创建和存储cookie
2014/05/27 Javascript
js中setTimeout()与clearTimeout()用法实例浅析
2015/05/12 Javascript
JavaScript中闭包之浅析解读(必看篇)
2016/08/25 Javascript
webpack独立打包和缓存处理详解
2017/04/03 Javascript
详解cordova打包成webapp的方法
2017/10/18 Javascript
详解node.js的http模块实例演示
2018/07/12 Javascript
JS精确判断数据类型代码实例
2019/12/18 Javascript
JS函数基本定义与用法示例
2020/01/15 Javascript
原生JavaScript实现的无缝滚动功能详解
2020/01/17 Javascript
python列表与元组详解实例
2013/11/01 Python
python比较两个列表是否相等的方法
2015/07/28 Python
Python3.5 处理文本txt,删除不需要的行方法
2018/12/10 Python
关于torch.optim的灵活使用详解(包括重写SGD,加上L1正则)
2020/02/20 Python
Python eval函数原理及用法解析
2020/11/14 Python
用CSS3打造HTML5的Logo(实现代码)
2016/06/16 HTML / CSS
科沃斯机器人官网商城:Ecovacs
2016/08/29 全球购物
电影T恤、80年代T恤和80年代服装:TV Store Online
2020/01/05 全球购物
盛大二次面试题
2016/11/18 面试题
斯福泰克软件测试面试题
2015/02/16 面试题
自荐信格式简述
2014/01/25 职场文书
护士演讲稿优秀范文
2014/04/30 职场文书
2014年团员学习十八大思想汇报
2014/09/13 职场文书
2015年电信员工工作总结
2015/05/26 职场文书
教师学习中国梦心得体会
2016/01/05 职场文书
2016年社区植树节活动总结
2016/03/16 职场文书
2016年企业安全生产月活动总结
2016/04/06 职场文书
情况说明书格式及范文
2019/06/24 职场文书
写作技巧:如何撰写一份优秀的营销策划书
2019/08/13 职场文书
导游词之铁岭象牙山
2019/12/06 职场文书
Nginx的基本概念和原理
2022/03/21 Servers
Java GUI编程菜单组件实例详解
2022/04/07 Java/Android