减少DOM元素数量的最佳方法

Question

大家都同意减少DOM元素意味着更好的页面性能。这意味着更好的JavaScript性能，特别是在旧版浏览器中。

但这里是最好的地方看看，以减少DOM元素？你们遇到的常见罪魁祸首是哪些简单的修复方法可以减少这个数字？

Answer 1

使用：

<ul id="navigation-main"> 
    etc.. 
</ul> 

在代替：

<div id="navigation-main"> 
    <ul> 
     etc.. 
    </ul> 
</div> 

...如果可能的话，那是。有时您需要额外的div进行布局。但是，如果没有必要，请勿使用它。

Answer 2

您使用元素来影响布局的任何地方通常都是您可以考虑的事情。通常情况下，您可以使用较少的元素与CSS结合来获得相同的结果。硬规则很难，因为它很大程度上取决于具体情况。

Answer 3

如果您使用ASP.NET服务器控件，那么这可能是一个很好的开始。一些服务器端控件虽然对于快速开发非常有用，但会以过多的标记渲染自己。我不是主张你不使用服务器端控件，但是你可能会发现你的站点的一些模块可以很好地减少DOM的数量

1）自己重写标记或者 2）用System.Web.UI.HtmlControls命名空间。

这种方法较好的选择是在自己的网站经常（页眉，页脚，导航菜单）组件。候选人也不经常改变或修改，除非你很喜欢这种风格。

另一个ASP.NET的特定技术是使用System.Web.UI.WebControls.PlaceHolder来动态使用，而不是使用runat="server"属性的div或面板。占位符控件将不会呈现任何其他元素，只会添加您添加的元素。