javascript - 当一个标签中的字超过9个字符就以省略号显示,详情看截图
问题描述
要求左边的span标签中的字超过9个字符就以点省略号显示,右边的span和左边span是一样的
问题解答
回答1：$(’span’).text().length>9?$(’span’).text($(’span’).text().slice(0,9)+’...’):$(’span’).text($(’span’).text())
回答2：给你来了个JS 版 num*10是后面的三个点需要占一个位置
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <meta name='viewport' content='width=device-width, initial-scale=1.0'> <meta http-equiv='X-UA-Compatible' content='ie=edge'> <title>Document</title> <style>span { display: inline-block; /*font-size: 24px;*/}.hidden { white-space: nowrap; /*width: calc(24px*9);*/ text-overflow: ellipsis; overflow: hidden;} </style></head><body> <h3><span class='a'>哈哈哈哈哈哈哈哈哈哈哈哈</span>-<span class='b'>哈呵呵呵呵呵呵还好还好还好</-span> </h3></body><script type='text/javascript'> window.onload = function(){function hideWords(tagClass) { var spanTag = document.querySelector(tagClass), fz = document.defaultView.getComputedStyle(spanTag).fontSize, num = parseFloat(fz); var widths = num*10; spanTag.style.width = widths + ’px’; if(spanTag.innerHTML.length > 9) {spanTag.setAttribute(’class’,’hidden’); }}hideWords(’.a’);hideWords(’.b’); }</script></html>
网公网安备