html中如何让td里面的文字遇到数字就自动换行_随笔

给table加个id，如：<table

width="200"

border="1"

id="result">然后遍历其下的所有td，替换字符，写一个函数，让他在页面载入完成后执行。 function

numAddBr(){

var

document.getElementById('result').getElementsByTagName("tr")

for

(var

i=1i<tr.lengthi++)

{

var

tr[i].cells.length

for(var

j=0j<tdj++){

tr[i].cells[j].innerHTML

tr[i].cells[j].innerHTML.replace(/([\d]+)([^\d]+)/g,'$1<br/>$2')

}

window.onload

numAddBr这是代码。我给你加了简单的判断，当内容是以数字结尾的时候，则不再加换行，如果数字出现在内容的中间部分或者开头则在其后添加换行。你也可以自己去掉，把

replace(/([\d]+)([^\d]+)/g,'$1<br/>$2')

改成

replace(/([\d]+))/g,'$1<br/>')

html中有两类元素(也就是标签)，block和inline。block类型的标签默认情况下会在两边自动加上换行。而inline则不会。表格属于block类型的，所以它会跳到下一行。要想让它不自动换行可以设置它的css样式display属性的值为inline.

如

<body>

这是前面的文字<table

style="display:inline"><tr><td>这是表格里的内容</td></tr></table>

</body>

用css的媒体查询试一下。

@mediascreen and(max-width: 960px) {

td {

width: 我觉得这里设个小一点的宽度应该可以。

}

欢迎分享，转载请注明来源：内存溢出

html中如何让td里面的文字遇到数字就自动换行