如何更换 Javascript 中的空格?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/33269131/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to replace with whitespace in Javascript?
提问by Alex Shmatko
I want to replace ' '
in my code with simple whitespaces " ". These things aren't actually the same.
我想' '
用简单的空格“”替换我的代码。这些东西其实不太一样。
How can I do this?
我怎样才能做到这一点?
This code won't work.
此代码将不起作用。
HTML
HTML
<p>No Space</p>
<p> 1 Space</p>
<p> 2 Spaces</p>
<p> 3 Spaces</p>
<p> 4 Spaces</p>
JS
JS
$(document).ready(function() {
$('p').each(function(){
$(this).html($(this).html().replace(/ /gi," "));
});
});
回答by Roko C. Buljan
If you look at the source code, after jQuery replaces NonBreakingSPaces
with " "
:
如果您查看源代码,在 jQuery 将 NonBreakingSPaces 替换
为" "
:
<p>No Space</p>
<p> 1 Space</p>
<p> 2 Spaces</p>
<p> 3 Spaces</p>
<p> 4 Spaces</p>
so the actual spacecharacters are present!!.
所以实际的空格字符是存在的!!.
Why than the spaces do not show up in the document?
为什么比空格不显示在文件中?
The main difference between nested spaces or spaces before a literal string character are eaten by the brower it's mainly an old ruleto prevent Inaccurate content spacing created by sloppy editorial, but not only that! imagine that all the spaces and newlines that you see inside an unminified (standard) HTML code - showed up in the result! You'd be forced to write oneliners.
浏览器吃掉了嵌套空格或文字字符串字符之前的空格之间的主要区别,主要是防止草率编辑造成内容间距不准确的旧规则,但不仅如此!想象一下,您在未缩小(标准)HTML 代码中看到的所有空格和换行符都显示在结果中!你会被迫写oneliners。
So if you're not using a word wrap style white-space: pre-wrap;
or an element like <pre>
that will PREserve your literal spaces the browser will clean the rendered content spaces for you.
因此,如果您不使用自动换行样式white-space: pre-wrap;
或类似的元素<pre>
来保留您的文字空间,浏览器将为您清理呈现的内容空间。
<pre>
<p>No Space</p>
<p> 1 Space</p>
<p> 2 Spaces</p>
<p> 3 Spaces</p>
<p> 4 Spaces</p>
</pre>
Using pre-wrap
to preserve literally spaces:
使用pre-wrap
从字面上保留空间:
body{ white-space: pre-wrap; }
<p>No Space</p>
<p> 1 Space</p>
<p> 2 Spaces</p>
<p> 3 Spaces</p>
<p> 4 Spaces</p>
Or you'll use exactly what you're trying to remove:
或者您将完全使用您要删除的内容:
https://en.wikipedia.org/wiki/Non-breaking_space
https://en.wikipedia.org/wiki/Standard_Generalized_Markup_Language
https://developer.mozilla.org/en-US/docs/Web/CSS/white-space
https://developer.mozilla.org/en-US/docs/Web/CSS/word-breakhttps://developer.mozilla.org/en-US/docs/Web/CSS/word-wrap
https://en.wikipedia.org/wiki/Non-breaking_space
https://en.wikipedia.org/wiki/Standard_Generalized_Markup_Language
https://developer.mozilla.org/en-US/docs/Web/CSS/white-空间
https://developer.mozilla.org/en-US/docs/Web/CSS/word-break https://developer.mozilla.org/en-US/docs/Web/CSS/word-wrap
回答by IanGabes
Your code is working fine, test this by replacing " "
with "s"
or some other letter to see how the nbsp is being replaced.
您的代码工作正常,通过替换" "
为"s"
或其他一些字母来测试它,看看 nbsp 是如何被替换的。
Any number of spaces in paragraph tags only count as one space.
段落标签中的任意数量的空格仅计为一个空格。
Replace the <p>
tag with a <span>
, and you will see your replacement has worked.
用 替换<p>
标签<span>
,您将看到您的替换已生效。
HTML:
HTML:
<p>No Space</p>
<span> 4 Spaces</span>
<p> 2 Spaces</p>
<p> 3 Spaces</p>
<p> 4 Spa ces</p>
JS:
JS:
$(document).ready(function() {
$('p').each(function(){
$(this).html($(this).html().replace(/ /gi,"s"));
});
});
回答by wawawoom
Use a Regex on the textContent :
在 textContent 上使用正则表达式:
$(document).ready(function() {
var re = new RegExp(String.fromCharCode(160), "gi");
$('p').each(function(){
$(this).html($(this)[0].textContent.replace(re, " "));
});
});
回答by Paul Kienitz
What may be happening is that the literal in the javascript is being decoded before the JS is compiled. One way to cure this would be to put it into a separate .js file instead of inline in the HTML. Another would be to try representing it as /&nbsp;/
.
可能发生的事情是文字 在编译 JS 之前,正在解码 javascript。解决此问题的一种方法是将其放入单独的 .js 文件中,而不是内联在 HTML 中。另一种方法是尝试将其表示为/&nbsp;/
.
(By the way, I had to enter "&nbsp;" into this textbox to show " " above... and I had to double the &s to illustrate that here. But I didn't have to do that inside the code ticks
. Just an oddity of SO.)
(顺便说一句,我必须在此文本框中输入“ ”才能在上方显示“ ”......我不得不将 &s 加倍以在此处说明这一点。但我不必这样做里面的那个code ticks
。只是一个奇怪的SO。)