25

请考虑以下 HTML <pre> 元素:

This is some  
example code which    
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;contains tabs

我想用 HTML 中的四个不间断空格字符(即  )替换所有制表符。我已经用 JavaScript 测试了上面的 pre 元素是否存在制表符,如下所示:

$('pre').ready(function() {
    alert(/\t/.test($(this).text()));
});

但它总是返回 false。谁能告诉我将制表符从源代码替换为 HTML NBSP 的正确过程?这些选项卡已由 Komodo Edit 添加,并且在查看源代码时可见。

4

3 回答 3

52

你可以这样做:

$('pre').html(function() {
    return this.innerHTML.replace(/\t/g, '&nbsp;&nbsp;&nbsp;&nbsp;');
});

这将遍历pre页面上的所有元素并为每个元素调用函数。jQuery的html函数使用我们给的函数的返回值来替换每个元素的内容。我们使用四个不间断空格String#replace替换 HTML 字符串中的所有(注意正则表达式上的标志)制表符字符。g

活生生的例子

于 2010-12-30T13:00:31.983 回答
10

它删除了换行符、多余的空格和换行符:

function removeNewlines(str) {
//remove line breaks from str
str = str.replace(/\s{2,}/g, ' ');
str = str.replace(/\t/g, ' ');
str = str.toString().trim().replace(/(\r\n|\n|\r)/g,"");
console.log(str);
}

演示:

function removeNewlines(str) {
//remove line breaks from str
str = str.replace(/\s{2,}/g, ' ');
str = str.replace(/\t/g, ' ');
str = str.toString().trim().replace(/(\r\n|\n|\r)/g,"");
  console.log(str);
}

$('#acceptString').click(function() {
    var str = prompt('enter string','');
    if(str)
        removeNewlines(str)
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='button' value='Enter String' id='acceptString' />

于 2013-10-24T09:27:50.807 回答
1

尝试这个:

var tab = RegExp("\\t", "g");
document.getElementById("text").value =
document.getElementById("text").value.replace(tab,'&nbsp;&nbsp;&nbsp;&nbsp;');
于 2010-12-30T13:01:27.200 回答