javascript - 断线测试

如何使用JS测试字符/HTML实体是换行还是不换行？
换行字符示例：
好的空间

非中断字符的示例如下：
- 单词连接符
我知道还有更多的HTML实体是行/不间断字符，我不知道它们是什么。如何在不事先知道的情况下检查线是否断了？

最佳答案

您可以通过创建一个最小宽度的测试div来测试它，然后检查文本是否换行到下一行。

var tester=document.getElementById("test");
var html=document.getElementById("html").value;

function testfor() {
  var tester=document.getElementById("test");
  var html=document.getElementById("html").value;
  var itIs=false;
  tester.innerHTML="a";
  var height_init=tester.clientHeight;
  console.log(height_init);
  tester.innerHTML+=html+"a";
  var height_final=tester.clientHeight;
  console.log(height_final);
  if(height_final > height_init) {
  	itIs=true
  }
  document.getElementById("return").innerHTML=itIs;
}
document.getElementById("html").addEventListener("keydown", function(e) {
    if (!e) { var e = window.event; }

    // Enter is pressed
    if (e.keyCode == 13) { testfor(); }
}, false);

#test{
  width: 1px;
  line-height: 30px;
  font-size: 18px;
}

<div id="test">this&nbsp;text&nbsp;box&nbsp;will&nbsp;take&nbsp;any&nbsp;length&nbsp;of&nbsp;string, and&nbsp;test&nbsp;if&nbsp;the&nbsp;lines&nbsp;break, however&nbsp;it&nbsp;was&nbsp;not&nbsp;designed&nbsp;to&nbsp;handle more&nbsp;than&nbsp;one&nbsp;character/entity/tag&nbsp;at&nbsp;a&nbsp;time</div>
<input id="html" type="text" placeholder="type an HTML character/entity/tag"/>
<p id="return">

</p>

关于javascript - 断线测试，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/35742160/