JS中关于换行的2个坑

Posted 2020-09-09

 //第一个为ul/ol使用中的li使用需要注意的地方

 1、<ul id="banner_indicator"><li></li><li></li><li></li><li></li></ul>

2、<ul id="banner_indicator">

　　<li></li>

　　<li></li>

　　<li></li>

　　<li></li>

　　</ul> 

//当使用以下调用方法

var indicatorTag = document.getElementById("banner_indicator");
var liNodes = indicatorTag.childNodes;

//小结：调用1时可以获得所有li成员，但是调用方法2时只能获得第一行的li。

---

 

//第二个是关于div换行需要注意的细节，这个相信很多人都遇到过

1、<div id="parent">

　　　　<div></div>

　　　　<div></div>

　　　　<div></div>

     </div>

2、

　　<div>

　　　　<div></div><div></div><div></div>

     </div>

//当用第一种内层div之间总有间隙，就算在主div样式中设置如下CSS参数

#parent {

　　　　margin=0;

　　　　padding=0;

　　　　border=0;

}

//结果不会发生任何变化，还是会有间隙，但是使用第二种样式后间隙就消失了， 小结：在使用div换行时默认是加了一个空格的距离。