1. 程式人生 > >HTML5中標籤之間儘量不要加enter或者空格

HTML5中標籤之間儘量不要加enter或者空格

HTML5中如果標籤之間隨意使用換行或者空格可能會出現意向不到的bug.

具體例項:

寫法一:

<ul id="list1"><li></li><li></li><li></li><li></li><li></li></ul>

寫法二:

<ul id="list2">

<li></li>

<li></li>

<li></li>

<li></li>

<li></li>

</ul>

如上所示,如果一個ul標籤使用上述2種寫法,使用以下方法提取出來的陣列將截然不同:

<script type="text/javascript">

var list1Tag=document.getElementById("list1"); //通過id獲取list1標籤
var liNodes1=list1Tag.childNodes;  //通過.childNodes;方法將ul中的子標籤存入liNodes1陣列中

var list2Tag=document.getElementById("list2"); //通過id獲取list2標籤
var liNodes2=list2Tag.childNodes;  //通過.childNodes;方法將ul中的子標籤存入liNodes2陣列中

</script>

通過debug可以檢視liNodes1和liNodes2兩個陣列的內容:

liNodes1=[<li>,<li>,<li>,<li>,<li>];

liNodes2=[<text>,<li>,<text>,<li>,<text>,<li>,<text>,<li>,<text>,<li>,<text>];

以上結果不難看出:編譯器自動將換行的區域當作一個<text>標籤,在使用liNodes.item(index);方法取標籤時會出現取出來的不是<li>標籤的bug。