今天在看有浏览器内部工作原理这篇文章的时候突发奇想，标签到底可以嵌套多少层？

大概像这样： <div> <div> <div></div> </div> </div>

我写了段js代码做测试：

1
2
3
4
5
6
7
8
9
10
11
12
$(function(){
  var sum = 100; //嵌套的层数
  var str = "";
  for(var i = 0; i<sum; i++){
    str += "<div>" + i;
  }
  for(var j = 0; j<sum; j++){
    str += "</div>";
  }
  console.log(str);
  $("body").append(str);
})

首先嵌套100层

IE：在嵌套到60层的时候，在开发者工具里面后面的嵌套展示不出来，但是右键编辑HTML还是可以编辑。

firefox：在嵌套到94层的时候，和ie的情况一样。

chrome：正常显示

嵌套500层

IE：能正常显示

firefox：最多嵌套200层，后面的标签不能显示，只显示文本

chrome：正常显示

嵌套1000层

IE: ie崩溃了，经过测试，嵌套到788层不会崩溃，多一层就会崩溃。

firefox：同上

chrome：正常显示

最后，chrome我测试了200000层都能正常工作。

总结：

IE：最多嵌套788层，多一层都会崩溃(可能跟我的电脑配置有关)。

firefox：最多只能嵌套200层，后面的嵌套只显示文本。

chrome：我嵌套了200000层，还能正常显示，后面我就没有测试了。

这篇文章，纯属博主娱乐，不专业也不权威！