js中如何html文本p中加个转行符号,js实现html表格<td>标签中带换行的文本显示出换行效果...

遇见问题

如下内容中我写了几行，但是表格中并未按行显示，换行符反而变成了空格，于是想自己转换下

思考问题

1、可以看到表格的内容是后端传来的数据，于是想直接在后端转换下，把换行符替换成
标签

2、想到就做，如下，写好后一跑，发现，
只是显示成了文本，并不会被html识别成标签。。。啪啪啪打脸

3、继续想，准备在数据加载后，在js里面处理下，把文本内容中的换行符转为
标签；但是如果一个内容有多行文字，我就要把它拆分为多个小节，
好加，但是这些分开的文字怎么连在一起呢，势必还需要继续加标签，那么加什么标签呢？准备加span等等。。

等下，我直接加个p不就行了吗？把原先每一小节的内容放到一个p里。好，就这么干把。。

解决问题

1、首先，网页加载好执行处理函数

$(document).ready(function(){

turnGray(); //完成状态数据背景置灰

replaceBr(); //内容中换行符显示

});

2、处理函数如下

//内容显示换行符

function replaceBr(){

var content = $('.data_table tr td:nth-child(3)');

content.each(function(){

var txt = $(this).text();

var j =0;

var span = document.createElement("span");

for(i=0;i

if(txt.charAt(i)=='\n'){

var p = document.createElement("p");

var partTxt = txt.slice(j,i);

p.innerHTML = partTxt;

//由于p标签内容为空时，页面不显示空行，加一个

if(partTxt==''){

p.appendChild(document.createElement("br"));

}

span.appendChild(p);

j = i + 1;

}

}

var p_end = document.createElement("p");

p_end.innerHTML = txt.slice(j);

$(this).text('');

span.appendChild(p_end);

$(this).append(span);

});

}

3、期间又遇到一个问题，按想象中写好之后执行效果如下：

4、WTF!!我的第四行跑哪去了？F12看了下，第四行的p也是有的啊，好吧，p内容是空它不显示。。。

5、可以看到第2点的代码中标粉色的地方，我给空p加了个br，还是没能绕过br....好吧这下显示正常了

Dev中控件的js事件代码放在form标签中存在问题

Dev中控件的js事件代码放在form标签中会获取不到(head标签中有其他js代码,未验证是否是这个问题)

求出数组中所有数字的和&amp&semi;&amp&semi;弹出层效果

nput[type=checkbox][name='cid']:checked")   if (checkedbox.size( ...

在IE6&sol;7下表格td标签没有内容时不显示边框？

有以下几种方法: 1.在单元格中加入一个空格.这样:

  2.直接在table里这样写:

表格td标签在不添加多余标签的情况下实现文本内容单行显示，多余部分省略号表示的方法

#table { table-layout: fixed; } .content { white-space: nowrap; text-overflow: ellipsis; -o-text-ove ...

iosselect：一个js picker项目，在H5中实现IOS的select下拉框效果

具体文档和demo可以访问github:https://github.com/zhoushengmufc/iosselect 移动端浏览器对于select的展示样式是不一致的,ios下是类似原生的pi ...

设置表格td超出内容后截取并以&period;&period;&period;显示

.ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }