如何从给定的html字符串中删除开头和结尾的空格?


177

我有以下HTML字符串。JavaScript中从该字符串中删除前导和尾随空格的示例代码是什么?

<p>&nbsp;&nbsp;</p>
<div>&nbsp;</div>
Trimming using JavaScript<br />
<br />
<br />
<br />
all leading and trailing white spaces
<p>&nbsp;&nbsp;</p>
<div>&nbsp;</div>


你真正的问题是什么?您要在文档中插入节点之前删除空格吗?
Rob W

我要删除所有前导空格以及所有尾随空格。我非常喜欢C#中的Trim方法,除了它甚至删除空格。
Sunil 2012年

因此,在我的示例中,修整后我终于应该得到以下内容:使用JavaScript修整所有前导和尾随空白
Sunil 2012年

@Sunil我不知道您是否曾经解决过这个问题,但是您可以尝试以下解决方案之一:stackoverflow.com/questions/16708158/…–
克里斯·贝克

Answers:


244

看到字符串方法trim()- https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String/Trim

var myString = '  bunch    of <br> string data with<p>trailing</p> and leading space   ';
myString = myString.trim();
// or myString = String.trim(myString);

编辑

如其他评论所述,可以使用正则表达式方法。该trim方法实际上只是正则表达式的别名:

if(!String.prototype.trim) {  
  String.prototype.trim = function () {  
    return this.replace(/^\s+|\s+$/g,'');  
  };  
} 

……这会将方法注入本机原型中,以供那些仍在池浅端游泳的浏览器使用。


3
我宁愿使用正则表达式,因为并非所有浏览器都支持它(咳嗽 IE <9)。
PeeHaa 2012年

2
修剪方法不会修剪空格,而只会修剪空格。所以这不是我想要的。
Sunil 2012年

8
我不确定您认为“空格”是什么,但是修剪会删除一般的空格(换行符,空格,制表符等),而不仅仅是空格字符。
2013年

2
@bsa我开始理解他在视觉上的意思是“空白”,就像“在呈现HTML结果中的视觉空白区域”一样,然后他在“由br标签引起的换行符之外”上方添加了注释。
克里斯·贝克

2
为什么在170个投票中没有复选标记?有时候让我感到困惑。
tcoulson

63
var str = "  my awesome string   "
str.trim();    

对于旧版浏览器,请使用正则表达式

str = str.replace(/^[ ]+|[ ]+$/g,'')
//str = "my awesome string" 

2
“ []”与“”完全相同。一个正好一个字符的字符分组就是.....正好一个字符。
Flimzy 2015年

2
@Flimzy:是的,它会更有意义写[\t\n\ ]或者只是\s代替[ ]这是没有意义的。
erik 2015年

11
string.replace(/^\s+|\s+$/g, "");

阅读问题,&nbsp;用于代替普通的空格。最重要的是,空格包含在标签中。
Rob W

6

如果您使用的是多行字符串,例如代码文件:

<html>
    <title>test</title>
    <body>
        <h1>test</h1>
    </body>
</html>

并希望替换所有引线,以获得以下结果:

<html>
<title>test</title>
<body>
<h1>test</h1>
</body>
</html>

您必须将multiline标志添加到正则表达式中,^$逐行匹配:

string.replace(/^\s+|\s+$/gm, '');

docs的相关报价:

“ m”标志指示多行输入字符串应视为多行。例如,如果使用“ m”,则“ ^”和“ $”将从仅在整个字符串的开头或结尾的匹配更改为字符串中任何行的开头或结尾。


4

我知道这是一个很老的问题,但是仍然没有一个公认的答案。我看到您要删除以下内容:“空”的html标签和基于html字符串的空白。

我根据您的评论为您要的输出提出了一个解决方案:

Trimming using JavaScript<br /><br /><br /><br />all leading and trailing white spaces 

var str = "<p>&nbsp;&nbsp;</p><div>&nbsp;</div>Trimming using JavaScript<br /><br /><br /><br />all leading and trailing white spaces<p>&nbsp;&nbsp;</p><div>&nbsp;</div>";
console.log(str.trim().replace(/&nbsp;/g, '').replace(/<[^\/>][^>]*><\/[^>]+>/g, ""));

.trim() 删除前导和尾随空格

.replace(/&nbsp;/g, '') 删除 &nbsp;

.replace(/<[^\/>][^>]*><\/[^>]+>/g, "")); 删除空标签


3
var trim = your_string.replace(/^\s+|\s+$/g, '');

1
是否会删除<br />或<p>&nbsp;&nbsp; </ p> <div>&nbsp; </ div>之类的空格?整理简单空间不是问题。它是我追求的空白删除。
Sunil 2013年

它会删除空白

3

01)。如果只需要删除前导空格和尾随空格,请使用以下命令:

var address = "  No.255 Colombo  "
address.replace(/^[ ]+|[ ]+$/g,'');

这将返回字符串“ No.255 Colombo”

02)。如果需要删除所有空白,请使用以下命令:

var address = "  No.255 Colombo  "
address.replace(/\s/g,"");

这将返回字符串“ No.255Colombo”

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.