html的一个细节
起因
今天那个多路线planner已经基本可以用了(还没有删除功能xp).然而我又发现了一个神奇的东西.
经过
样式基本如下
div.panel{
white-space:nowrap;
}
div.wrapper{
overflow-x:auto;overflow-y:hidden;
}
div.list{
display:inline-block;overflow-y:auto;
}
html截取部分如下
<div class="panel">
<div class="wrapper">
<div class="list"></div>
</div>
</div>
之后通过复制的方式向div.wrapper
的末端添加一个相同的div.list
,添加了几次之后,发现第一个和第二个之间有一个空缺,而后面之间都没有空缺,这让人很难受,F12
看了Elements,还是没有看见东西.直到最后试着在console里document.querySelector("div.wrapper").childNodes
.
结果
原来是因为我的html里面div.list
的上下有两个\n
,于是解析之后就出现两个#text
值为\n
,并且显示了出来,之前一直以为html里面的空格和换行都是不显示的,原来是自己观察的不够仔细.不过这真的挺麻烦的!不知以后是否还会遇到?