一行中的字符串

Question

我需要获得一个长字符串，才能在跨度块中仅显示一行。由于空间的原因，没有浏览器将其分成不同的行。我必须使用JS使字符串在按钮单击时出现。这是我尝试过的方法，但浏览器将其显示为多行。

 var beg= document.formname.elementname.value;
 var oneLine= beg.replace(/[\n]/g, " ");

Answer 1

您可以使用值为nowrap的CSS white-space属性将文本保留在一行上：

span {
  white-space: nowrap;
}

<span>This is a really, really long string built to showcase how white-space: nowrap works. Why it is this long, I do not know. But it will definitely overflow the edge of the element. Instead of wrapping, it will simply keep going off to the right, creating a horizontal scrollbar when necessary. Just adding in some additional Lorem Ipsum to ensure that it reaches the edge of the page when this snippet is viewed in full screen.</span>

如果您真的想使用JavaScript进行操作，则可以使用
{element}.style.whiteSpace = "nowrap"：

document.getElementsByTagName('span')[0].style.whiteSpace = "nowrap";

<span>This is a really, really long string built to showcase how white-space: nowrap works. Why it is this long, I do not know. But it will definitely overflow the edge of the element. Instead of wrapping, it will simply keep going off to the right, creating a horizontal scrollbar when necessary. Just adding in some additional Lorem Ipsum to ensure that it reaches the edge of the page when this snippet is viewed in full screen.</span>