我用Deepseek設(shè)計(jì)制作了一個(gè)數(shù)學(xué)化的交互式網(wǎng)頁(yè)，用來(lái)演示定積分的概念、幾何意義和主要性質(zhì)！最終頁(yè)面如下：

識(shí)別以下二維碼可以直接查看與體驗(yàn)交互式網(wǎng)頁(yè)效果，或點(diǎn)擊本文文末左下角閱讀原文可以直接下載完整版網(wǎng)頁(yè)文件，或者通過(guò)考研競(jìng)賽數(shù)學(xué)交流圈的文件分享中下載源文件！

也可以復(fù)制以下網(wǎng)址到瀏覽器地址欄打開(kāi)：

http://cmathc.cn/xwmath/integrate20251130.html

生成以上網(wǎng)頁(yè)效果的Deepseek提示詞如下：

用最新網(wǎng)頁(yè)制作技術(shù)與數(shù)學(xué)公式渲染技術(shù)制作一個(gè)HTML網(wǎng)頁(yè),內(nèi)容的主題是定積分的定義,要求能夠以交互式分割曲邊梯形圖形的方式演示元素法構(gòu)建定積分模型的過(guò)程,標(biāo)明定積分表達(dá)式各部分的名稱,比如積分下限,積分上限,積分號(hào),被積函數(shù),被積表達(dá)式,積分變量,積分和等,利用定積分的幾何意義意義計(jì)算定積分,并輔以圖形進(jìn)行演示說(shuō)明,定積分的主要性質(zhì),比如線性運(yùn)算性質(zhì),積分對(duì)區(qū)間的可加性,保號(hào)性,保序性,估值定理,中值定理,對(duì)于中值定理繪制圖形說(shuō)明其幾何意義!

在生成后會(huì)在當(dāng)前會(huì)話窗口的右上角有三個(gè)按鈕，如下圖。

三個(gè)按鈕分別是復(fù)制(將當(dāng)前生成的網(wǎng)頁(yè)代碼復(fù)制到剪貼板中)、下載（將當(dāng)前生成的HTML格式的網(wǎng)頁(yè)文件下載到本地電腦中）、運(yùn)行（直接運(yùn)行當(dāng)前生成的文件，在右側(cè)會(huì)另外開(kāi)一個(gè)區(qū)域用于顯示當(dāng)前生成效果）。

輸入以上提示詞第一次生成時(shí)，有些數(shù)學(xué)公式不能正常顯示，因此生成后另外給出了提示詞：數(shù)學(xué)公式不能正常顯示，重新設(shè)計(jì)制作網(wǎng)頁(yè)文件，要求使用最新的網(wǎng)頁(yè)數(shù)學(xué)公式顯示技術(shù)正確在網(wǎng)頁(yè)中顯示數(shù)學(xué)公式。

經(jīng)過(guò)一次修改后，公式顯示正常！但是原來(lái)的交互設(shè)計(jì)功能不能實(shí)時(shí)顯示效果，所以再次修改了要求其修改了交互式顯示效果。然后再下載了HTML文件到電腦中。

由于生成的網(wǎng)頁(yè)中有些文字內(nèi)容和公式還是不能滿足要求，因此用記事本重新大概了網(wǎng)頁(yè)文件，用查找命令定位需要修改的地方，進(jìn)行了部分文字修改！

值得注意的是：如果有些符號(hào)沒(méi)有正常顯示為數(shù)學(xué)公式，也可以直接修改公式內(nèi)容，并求將要顯示的Latex格式的數(shù)學(xué)符號(hào)與公式放置到“\(數(shù)學(xué)公式表達(dá)式\)”中。如果要求數(shù)學(xué)公式單獨(dú)一樣顯示，則放置到“\[ 要顯示的數(shù)學(xué)公式\]”中.

在修改的時(shí)候可以雙擊網(wǎng)頁(yè)文件用瀏覽器打開(kāi)，每次修改后可以直接通過(guò)瀏覽器的刷新按鈕刷新網(wǎng)頁(yè)查看修改效果。

最后得到的網(wǎng)頁(yè)完整代碼如下：

"zh-CN">

     
 "UTF-8">
    
 "viewport" content="width=device-width, initial-scale=1.0">
    定積分的定義與性質(zhì) - 交互式演示
  
 
    

     
 

 
 "container" 
 > 
 
 
         
 
 
 
             
定積分的定義與性質(zhì) 

 

"subtitle">通過(guò)交互式圖形演示理解定積分的概念、幾何意義和主要性質(zhì)
 

 
         
 

 
          

 
         

 
 "content" 
 > 
 
 
             
 

 
 "main-content" 
 > 
 
 
                 
 
 "definition" 
 > 
 
 
                     定積分的定義 
 
 
                     

定積分是微積分中的基本概念，用于計(jì)算曲線下的面積。設(shè)函數(shù) \( f(x) \) 在區(qū)間 \([a, b]\) 上連續(xù)，將區(qū)間任意分割為 \( n \) 個(gè)小區(qū)間，每個(gè)小區(qū)間長(zhǎng)度為 \( \Delta x_i \)，在每個(gè)小區(qū)間上任取一點(diǎn) \( \xi_i \)，則定積分定義為：
 

 
                      

 
                     

 
 "math" 
  id= 
 "integral-definition" 
 > 
 
 
                         \[ \int_{a}^ f(x) \, dx =\mathop {\lim }\limits_{\lambda  \to 0} \sum\limits_{i= 1}^n {f({\xi _i})\Delta {x_i}}, \] 
 
 
 其中\(zhòng)(\lambda\)是所有子區(qū)間 \( \Delta x_i \) 的長(zhǎng)度的最大值. 
 
 
 
 
                     
 
 

 
                      

 

其中：
 

 
                     

• 

• \( \int \) 是積分符號(hào)
• 

• \( a \) 和 \( b \) 分別是積分的下限和上限
• 

• \( f(x) \) 是被積函數(shù)
• 

• \( dx \) 表示積分變量
• 

• \( \sum_{i=1}^{n} f(\xi_i) \Delta x_i \) 稱為積分和或黎曼和
• 


 

 

 

特別注意：定積分要存在，要求對(duì)任意分割、每個(gè)子區(qū)間上任意取點(diǎn)，要求積分和的極限都存在且相等。 

 
                      

 
                     曲邊梯形的分割演示 

 

調(diào)整下面的參數(shù)，觀察曲邊梯形如何被分割為小矩形，以及隨著分割數(shù)增加，矩形面積和如何逼近曲邊梯形的面積： 

 
                      

 
                     

 
 "demo-container" 
 > 
 
 
                         
 
 "integralCanvas" 
 > 
 
 
 
                     
  

 
                      

 
                     

 
 "controls" 
 > 
 
 
                         
 
 
 "control-group" 
 > 
 
 
                             
 
 for 
 = 
 "nPartitions" 
 >分割數(shù): 
 
 
                             
 
 type 
 = 
 "range" 
  id= 
 "nPartitions" 
  min= 
 "2" 
  max= 
 "100" 
  value= 
 "10" 
 > 
 
 
                             "nValue" class="value-display">10 
                        
 
 
  

 
                          

 
                         

 
 "control-group" 
 > 
 
 
                             
 
 for 
 = 
 "functionSelect" 
 >函數(shù): 
 
 
                             "functionSelect">                                "quadratic">二次函數(shù) f(x) = x2                                "sine">正弦函數(shù) f(x) = sin(x)                                "linear">線性函數(shù) f(x) = x                            
 
 
                         
 
  

 
                          

 
                         

 
 "control-group" 
 > 
 
 
                             
 
 for 
 = 
 "methodSelect" 
 >分割方法: 
 
 
                             "methodSelect">                                "left">左端點(diǎn)                                "right">右端點(diǎn)                                "midpoint" selected>中點(diǎn)                            
 
 
                         
 
  

 
                          

 
                         "resetBtn">重置 

 
                     

 

 
                      

 
                     

 
 "legend" 
 > 
 
 
                         
 
 
 "legend-item" 
 > 
 
 
                             
 
 
 "color-box" 
  style= 
 "background-color: rgba(65, 105, 225, 0.7);" 
 > 
  

 
                             曲邊梯形 

 
                         

 

 
                         

 
 "legend-item" 
 > 
 
 
                             
 
 
 "color-box" 
  style= 
 "background-color: rgba(255, 99, 71, 0.5);" 
 > 
  

 
                             小矩形 

 
                         

 

 
                         

 
 "legend-item" 
 > 
 
 
                             
 
 
 "color-box" 
  style= 
 "background-color: rgba(50, 205, 50, 0.7);" 
 > 
  

 
                             曲線 

 
                         

 

 
                     

 

 
                 

 

 
                  

 
                 
 
 "geometric-meaning" 
 > 

 
                     定積分的幾何意義 

 

定積分 \( \int_{a}^ f(x) \, dx \) 的幾何意義是曲線 \( y = f(x) \) 與 \(x\) 軸在區(qū)間 \([a, b]\) 上所圍成的曲邊梯形的面積。當(dāng) \( f(x) \) 在 \(x\)  軸上方時(shí)，面積為正；在 \(x\)  軸下方時(shí)，面積為負(fù)。 

 
                      

 
                     

 
 "demo-container" 
 > 
 
 
                         
 
 "areaCanvas" 
 > 
 
 
 
                     
  

 
                      

 
                     

 
 "controls" 
 > 
 
 
                         
 
 
 "control-group" 
 > 
 
 
                             
 
 for 
 = 
 "lowerLimit" 
 >積分下限 a: 
 
 
                             
 
 type 
 = 
 "range" 
  id= 
 "lowerLimit" 
  min= 
 "0" 
  max= 
 "4.5" 
  step= 
 "0.1" 
  value= 
 "1" 
 > 
 
 
                             "aValue" class="value-display">1.0 
                        
 
 
  

 
                          

 
                         

 
 "control-group" 
 > 
 
 
                             
 
 for 
 = 
 "upperLimit" 
 >積分上限 b: 
 
 
                             
 
 type 
 = 
 "range" 
  id= 
 "upperLimit" 
  min= 
 "0.5" 
  max= 
 "5" 
  step= 
 "0.1" 
  value= 
 "3" 
 > 
 
 
                             "bValue" class="value-display">3.0 
                        
 
 
  

 
                     

 

 
                      

 
                     

 
 "math" 
  id= 
 "areaResult" 
 > 
 
 
                         面積 = 計(jì)算中... 
 
 
                     
  

 
                 

 

 
                  

 
                 
 
 "properties" 
 > 

 
                     定積分的主要性質(zhì) 

 
                      

 
                     

• "property-list" >


• "property-title" >線性運(yùn)算性質(zhì)

  "math" >
\[ \int_{a}^ [\alpha f(x) + \beta g(x)] \, dx = \alpha \int_{a}^ f(x) \, dx + \beta \int_{a}^ g(x) \, dx \]


  其中 \( \alpha \) 和 \( \beta \) 是常數(shù)。

• 



• "property-title" >積分對(duì)區(qū)間的可加性

  "math" >
\[ \int_{a}^ f(x) \, dx = \int_{a}^{c} f(x) \, dx + \int_{c}^ f(x) \, dx \]


  只要函數(shù)在三個(gè)積分區(qū)間上都可積，則上式都成立。

• 



• "property-title" >保號(hào)性

  如果在區(qū)間 \([a, b]\) 上 \( f(x) \geq 0 \)，則 \( \int_{a}^ f(x) \, dx \geq 0 \)。

• 



• "property-title" >保序性

  如果在區(qū)間 \([a, b]\) 上 \( f(x) \leq g(x) \)，則 \( \int_{a}^ f(x) \, dx \leq \int_{a}^ g(x) \, dx \)。

• 



• "property-title" >估值定理

  如果 \( m \leq f(x) \leq M \) 在區(qū)間 \([a, b]\) 上成立，則：

  "math" >
\[ m(b -a ) \leq \int_{a}^ f(x) \, dx \leq M(b -a ) \]


• 



• "property-title" >積分中值定理

  "math" >
\[ \int_{a}^ f(x) \, dx = f(\xi)(b -a ) \]


  其中 \( \xi \in [a, b] \)。該定理表明在區(qū)間 \([a, b]\) 上至少存在一點(diǎn) \( \xi \)，使得以 \( f(\xi) \) 為高的矩形面積等于曲邊梯形的面積。

• 


 

 
                 

 

 
                  

 
                 
 
 "mean-value-theorem" 
 > 

 
                     積分中值定理的幾何意義 

 

積分中值定理表明，在區(qū)間 \([a, b]\) 上至少存在一點(diǎn) \( \xi \)，使得以 \( f(\xi) \) 為高的矩形面積等于曲邊梯形的面積。下面的圖形演示了這一幾何意義： 

 
                      

 
                     

 
 "demo-container" 
 > 
 
 
                         
 
 "mvtCanvas" 
 > 
 
 
 
                     
  

 
                      

 
                     

 
 "controls" 
 > 
 
 
                         
 
 
 "control-group" 
 > 
 
 
                             
 
 for 
 = 
 "mvtLower" 
 >積分下限 a: 
 
 
                             
 
 type 
 = 
 "range" 
  id= 
 "mvtLower" 
  min= 
 "0" 
  max= 
 "4.5" 
  step= 
 "0.1" 
  value= 
 "1" 
 > 
 
 
                             "mvtAValue" class="value-display">1.0 
                        
 
 
  

 
                          

 
                         

 
 "control-group" 
 > 
 
 
                             
 
 for 
 = 
 "mvtUpper" 
 >積分上限 b: 
 
 
                             
 
 type 
 = 
 "range" 
  id= 
 "mvtUpper" 
  min= 
 "0.5" 
  max= 
 "5" 
  step= 
 "0.1" 
  value= 
 "3" 
 > 
 
 
                             "mvtBValue" class="value-display">3.0 
                        
 
 
  

 
                     

 

 
                      

 
                     

 
 "math" 
  id= 
 "mvtResult" 
 > 
 
 
                         中值點(diǎn) ξ = 計(jì)算中... 
 
 
                     
  

 
                 

 

 
             

 

 
              

 
             

 
 "sidebar" 
 > 
 
 
                 
 
 "quick-nav" 
 > 
 
 
                     快速導(dǎo)航 
 
 
                     
 

• 

• ">定積分的定義
• 

• -meaning">幾何意義
• 

• ">主要性質(zhì)
• 

• -value-theorem">中值定理
• 


 

 
                 

 

 
                  

 
                 
 
 "key-concepts" 
 > 

 
                     關(guān)鍵概念 

 
                     

• 

• 積分下限與上限
• 

• 被積函數(shù)與積分變量
• 

• 積分和（黎曼和）
• 

• 曲邊梯形
• 

• 面積元素
• 

• 積分中值
• 


 

 
                 

 

 
                  

 
                 
 
 "interactive-tips" 
 > 

 
                     交互提示 

 

調(diào)整分割數(shù)觀察近似精度的變化 

 

嘗試不同的分割方法（左端點(diǎn)、右端點(diǎn)、中點(diǎn)） 

 

拖動(dòng)積分上下限觀察面積變化 

 

觀察中值定理的幾何解釋 

 
                 

 

 
             

 

 
         

 

 
          

 
         
 

 

定積分交互式演示 ? 2025 | 微信公眾號(hào):考研競(jìng)賽數(shù)學(xué) | 使用 Canvas 繪制圖形 

 
         
 

 
     


 

注意：如果不想通過(guò)鏈接下載網(wǎng)頁(yè)文件，也可以直接復(fù)制上面的完整代碼，然后打開(kāi)系統(tǒng)中的記事本程序，將它粘貼到文本編輯框中，然后在保存文件的會(huì)話框中，選擇保存類型為“所有文件（*.*）”，并在文件名編輯框中修改文件名的擴(kuò)展名為“.html”，如下圖。

這樣保存的就是網(wǎng)頁(yè)文件，雙擊它就可以用系統(tǒng)默認(rèn)的瀏覽器直接看到查閱最終顯示效果。

往期推薦閱讀

1、

2、

3、

4、

5、

微信公眾號(hào)：考研競(jìng)賽數(shù)學(xué)(ID: xwmath)大學(xué)數(shù)學(xué)公共基礎(chǔ)課程分享交流平臺(tái)！支持咱號(hào)請(qǐng)點(diǎn)贊分享！