首页 > 代码库 > 文字截取,多余文字用省略号(...)代替
文字截取,多余文字用省略号(...)代替
CSS方法:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>用css截取标题,更利于seo</title></head><body><div style="width: 150px; font-size:12px; height: 50px; border: 1px solid blue; overflow: hidden; text-overflow:ellipsis; -o-text-overflow: ellipsis; white-space:nowrap;">就是比如有一行文字,很长,表格内一行显示不下</div></body></html>
JavaScript实现文本过长自动省略
一般情况下,如果要控制一段文字超出长度可以用CSS 去控制
下面我来介绍2种用js控制字符数长度显示的方法,其实这2个方法也是大同小异
方法一:
<script type="text/javascript">function check(node){ var str = node.firstChild.nodeValue; if(str.length>10){ node.firstChild.nodeValue = str.substring(0,10) + "..."; }}window.onload=function(){ var tagK = document.getElementByIdx_x("kk2"); check(tagK); // tagK里面不能再包含别的标签}</script>
方法二:
<script type="text/javascript"> function checkWord(element){ var innerText = (typeof element.textContent == "string") ? element.textContent : element.innerText; //注意:因为 不同浏览器对innerText 和textContent的兼容,这里是为了匹配不同浏览的兼容性,IE,Safari,Chrome,Opera支持innerText属性,Firefox不支持innerText,但是支持作用类似的textContent属性 var wlength = innerText.length; if(wlength>20) { var shortWord = innerText.substr(0,10); element.innerHTML = shortWord +"..."; } }window.onload=function() { var tag = document.getElementByIdx_x("kk"); var tagNode = document.getElementsByTagName_r("p"); checkWord(tag); for(var i=0; i<tagNode.length; i++) { checkWord(tagNode[i]);}}</script>
我们以下面的HTML 代码为例进行应用:
<div id="kk1"><span class="fg">gggggggggggggkkkkkkkkkkffffff</span>如果是长的就对宽进行变形</div>
<div id="kk2">gggggggggggggkkkkkkkkkkffffff如果是长的就对宽进行变形</div>
<p>ghghgh首先判断图片是长的还是宽的。如果是长的就对宽进行变形,否则对高进行变形</p>
<p><span class="fg">gggggggggggggkkkkkkkkkkffffff</span>首先判断图片是长的还是宽的。如果是长的就对宽进行变形,否则对高进行变形</p>
<p><span class="fg">gggggggggggggkkkkkkkkkkffffff</span>首先判断图片是长的还是宽的。如果是长的就对宽进行变形,否则对高进行变形</p>
文字截取,多余文字用省略号(...)代替
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。