如何用ASP.NET C#服务端逻辑动态添加<div>？求对比与示例

完全可以。下面分别说明服务端逻辑与jQuery逻辑的核心区别、最优实现方案，并提供对应示例代码。

服务端逻辑与jQuery逻辑的主要区别 #

• 执行时机与位置：服务端逻辑在服务器渲染页面阶段生成HTML，浏览器最终收到的是已经包含所有动态
  的完整页面；jQuery则是在浏览器加载完页面后，在客户端通过JS动态向DOM中追加元素。
• 数据访问能力：服务端可直接读取后端数据库、Session、服务器文件等资源，无需额外请求；jQuery若需使用后端数据，必须通过AJAX调用服务端接口获取。
• SEO与性能：服务端生成的内容原生存在于HTML中，搜索引擎爬虫可直接抓取，且无需客户端额外执行JS渲染；jQuery动态生成的内容可能无法被爬虫识别，还会消耗客户端浏览器资源。
• 交互灵活性：jQuery支持在用户交互（如点击、滚动）时动态生成元素，更适合实时响应操作；服务端生成的内容是一次性的，若要更新需重新加载页面或结合AJAX。

最优实现方案 #

根据ASP.NET的不同技术栈，推荐两种主流实现方式：

1. ASP.NET Web Forms 实现 #

前端页面（Default.aspx）

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApp.Default" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>服务端动态生成Div</title>
    <style>
        .dynamic { margin: 10px 0; padding: 10px; border: 1px solid #ccc; }
        .ui-title { font-size: 18px; margin: 0; }
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <div id="footer-div" runat="server">
            <!-- 服务端动态生成的Div将插入此处 -->
        </div>
    </form>
</body>
</html>

后台代码（Default.aspx.cs）

using System;
using System.Web.UI.HtmlControls;

namespace WebApp
{
    public partial class Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                int length = 2;
                // 循环生成对应数量的Div
                for (int i = 0; i <= length; i++)
                {
                    // 创建外层Div
                    HtmlGenericControl dynamicDiv = new HtmlGenericControl("div");
                    dynamicDiv.Attributes["class"] = "dynamic";

                    // 创建标题H3
                    HtmlGenericControl title = new HtmlGenericControl("h3");
                    title.Attributes["class"] = "ui-title";
                    title.Attributes["role"] = "heading";
                    title.Attributes["aria-level"] = "1";
                    title.InnerText = "Dynamic div creating";

                    // 组装控件并添加到目标容器
                    dynamicDiv.Controls.Add(title);
                    footer_div.Controls.Add(dynamicDiv);
                }
            }
        }
    }
}

2. ASP.NET MVC（Razor视图）实现 #

控制器代码（HomeController.cs）

using System.Web.Mvc;

namespace MvcApp.Controllers
{
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            // 可从数据库/服务获取动态数量，此处用固定值
            ViewBag.DivCount = 2;
            return View();
        }
    }
}

Razor视图（Index.cshtml）

@{
    ViewBag.Title = "服务端动态生成Div";
}

<style>
    .dynamic { margin: 10px 0; padding: 10px; border: 1px solid #ccc; }
    .ui-title { font-size: 18px; margin: 0; }
</style>

<div id="footer-div">
    @* 直接用Razor语法循环生成Div *@
    @for (int i = 0; i <= ViewBag.DivCount; i++)
    {
        <div class="dynamic">
            <h3 class="ui-title" role="heading" aria-level="1">Dynamic div creating</h3>
        </div>
    }
</div>

内容的提问来源于stack exchange，提问作者ashok