Flush输出表格内容

以前看到关于table布局和div布局的对比，有人总结一条div的优势：table必须等到全部加载完成才能被浏览器显示出来，而div则是流式的边加载边显示。

今天得闲实验HttpResponse.Flush的时候顺手试试看table的加载行为。

 

打开VS， 新建一个ASP.NET MVC Web Application。在HomeController.cs中加入如下代码

public string FlushTable()
{
    this.Response.Write("<table style=\"border: 1px solid;\">");
    this.Response.Write("<thead><td style=\"width: 150px; border: 1px solid red;\">Country Name</td><td style=\"width: 100px; border: 1px solid red;\">Code</td>");
    this.Response.Write("<td style=\"width: 100px;border: 1px solid red;\">Alias</td><td style=\"width: 100px;border: 1px solid red;\">Capital</td></thead>");
    this.Response.Write("<tbody>");

    this.Response.Flush();
    System.Threading.Thread.Sleep(1000);

    this.Response.Write("<tr><td>United States</td><td>001</td><td>USA</td><td>Washington</td></tr>");
    this.Response.Flush();
    System.Threading.Thread.Sleep(1000);

    this.Response.Write("<tr><td>United Kingdom</td><td>xxx</td><td>UK</td><td>London</td></tr>");
    this.Response.Flush();
    System.Threading.Thread.Sleep(1000);

    this.Response.Write("<tr><td>China</td><td>086</td><td>PRC</td><td>Beijing</td></tr><tr>");
    this.Response.Flush();
    System.Threading.Thread.Sleep(1000);

    this.Response.Write("<td>Japan</td><td>xxx</td><td>Nihon</td><td>Tokyo</td></tr>");
    this.Response.Flush();
    System.Threading.Thread.Sleep(1000);

    this.Response.Write("</tbody></table>");           
    return "<h3>Finished</h3>";
}

在Chrome上测试显示，表格能够一行一行显示出来。（其他浏览器未测试）

但是测试足够表明之前看到的关于div布局和table布局的那句论断是不正确的。跟我一样半路出家的web程序员，还是应该多写代码多做实验。

 

尽信书则不如无书。

Tags: ASP.NET, MVC, HTML, 布局