PTT數位生活區 / Web_Design

[請益] 網頁技術是如何實現動態生成大量的html

看板Web_Design作者 (rainy)時間1年前 (2023/05/31 01:26), 編輯推噓4(4推 0噓 43→)
留言47則, 7人參與, 1年前最新討論串1/2 (看更多)
各位前輩好，小弟目前自學網頁半年，若用語有任何不當還請海涵並指正。 最近在練習如何做出一個評論/QA常見問題的區塊。 如果是少量的評論，直接替換HTML標籤裡的文字就好。 主要是想請教，是什麼樣的技術可以一直動態生成數以百計的評論呢？ 以我半年的學習角度會讓我聯想到word裡面的合併寄件功能，不知道兩者有無聯繫。 懇請各位前輩指點迷津了，謝謝。 -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 49.216.236.124 (臺灣) ※ 文章網址: https://www.ptt.cc/bbs/Web_Design/M.1685467613.A.5FD.html
推
05/31 01:59, 1年前 , 1F
你知道一些伺服器方的程式語言嗎? 如 php 或 asp 等的
05/31 01:59, 1F
推
05/31 04:24, 1年前 , 2F
每個評論都是被存在資料庫裡的，前端只是去call api撈
05/31 04:24, 2F
→
05/31 04:24, 1年前 , 3F
資料出來，再對這些資料去跑迴圈並顯示而已
05/31 04:24, 3F
→
05/31 08:38, 1年前 , 4F
繼續爬資料後 有看到結合php和SQL寫出來的系統 大致上可
05/31 08:38, 4F
→
05/31 08:38, 1年前 , 5F
以理解了
05/31 08:38, 5F
→
05/31 08:40, 1年前 , 6F
只是前後端如何串連 這部分還在我的理解外 會繼續學習
05/31 08:40, 6F
→
05/31 08:40, 1年前 , 7F
的 感謝
05/31 08:40, 7F
推
05/31 17:00, 1年前 , 8F
這個問題看起來你可以錄影再問清楚一點你看到什麼效
05/31 17:00, 8F
→
05/31 17:00, 1年前 , 9F
果？但這看起來就是JavaScript或Ajax當關鍵字可以找
05/31 17:00, 9F
→
05/31 17:00, 1年前 , 10F
到的問題
05/31 17:00, 10F
→
05/31 18:22, 1年前 , 11F
好的 ajax的原理我也還不太了解 再來學習
05/31 18:22, 11F
→
05/31 23:53, 1年前 , 12F
這個問題的關鍵字不應該是 JavaScript 或是 AJAX，雖然有些
05/31 23:53, 12F
→
05/31 23:53, 1年前 , 13F
相關……
05/31 23:53, 13F
→
05/31 23:54, 1年前 , 14F
瀏覽器會根據 URL 向伺服器發送請求，請求返回的內容會有不
05/31 23:54, 14F
→
05/31 23:54, 1年前 , 15F
同的格式，通常對應的是一個資源，可能是一個 HTML 文件、
05/31 23:54, 15F
→
05/31 23:55, 1年前 , 16F
可能是一張圖片或是影片，也可能會是 CSS 樣式表和 JS 腳本
05/31 23:55, 16F
→
05/31 23:55, 1年前 , 17F
；最起初的網際網路都是返回靜態的文件，也就是說是一份已
05/31 23:55, 17F
→
05/31 23:56, 1年前 , 18F
經固定內容的 HTML 檔案，而為了處理你說的這個問題，發展
05/31 23:56, 18F
→
05/31 23:56, 1年前 , 19F
出了 CGI 介面，可以交由伺服器上的某一支程式，根據請求的
05/31 23:56, 19F
→
05/31 23:57, 1年前 , 20F
內容，去產生要返回的 HTML 資料流，早期的 CGI 程式可以透
05/31 23:57, 20F
→
05/31 23:57, 1年前 , 21F
過 Perl, PHP 甚至 C 語言去撰寫；這些程式要獲取資料的方
05/31 23:57, 21F
→
05/31 23:58, 1年前 , 22F
式又可以非常多樣，比如說讀取伺服器上的另外一份文件中的
05/31 23:58, 22F
→
05/31 23:59, 1年前 , 23F
內容，或者是與資料庫交互取得資料等；現代多數的網頁後端
05/31 23:59, 23F
→
05/31 23:59, 1年前 , 24F
框架，都可以很簡單地透過搭配的模板引擎，填入資料並返回
05/31 23:59, 24F
→
06/01 00:00, 1年前 , 25F
結果。以現代的說法來說，這稱作 Server-side Rendering
06/01 00:00, 25F
→
06/01 00:00, 1年前 , 26F
這樣的過程，由於資料會根據請求，在伺服器端填充返回，並
06/01 00:00, 26F
→
06/01 00:01, 1年前 , 27F
不用涉及到 JavaScript 中再次請求內容和 AJAX 技術。
06/01 00:01, 27F
→
06/01 00:03, 1年前 , 28F
而 AJAX 技術，是為了處理同一個頁面上，不想要透過切換頁
06/01 00:03, 28F
→
06/01 00:03, 1年前 , 29F
面，就希望再次獲得資料，而透過使用者在頁面上的操作，再
06/01 00:03, 29F
→
06/01 00:04, 1年前 , 30F
次打請求到伺服器獲取資料，然後再由 JavaScript 將這些資
06/01 00:04, 30F
→
06/01 00:04, 1年前 , 31F
料，以操作頁面 DOM 元素的方式，將獲取到的資料渲染或掛上
06/01 00:04, 31F
→
06/01 00:05, 1年前 , 32F
。而現代 React 這類前端函數庫或框架，更是簡化了許多，讓
06/01 00:05, 32F
→
06/01 00:06, 1年前 , 33F
頁面內容得以先返回，剩下再藉由獲取資料來填充，由於這時
06/01 00:06, 33F
→
06/01 00:07, 1年前 , 34F
瀏覽器呈現的結果，幾乎都是在客戶端完成的，所以現代又稱
06/01 00:07, 34F
→
06/01 00:07, 1年前 , 35F
這樣的作法是 Client-Side Rendering
06/01 00:07, 35F
→
06/01 00:08, 1年前 , 36F
---
06/01 00:08, 36F
→
06/01 00:08, 1年前 , 37F
而即使是透過 AJAX 去獲取資料，這些資料也幾乎是在伺服器
06/01 00:08, 37F
→
06/01 00:09, 1年前 , 38F
交由一些程式邏輯去與資料庫交互，獲得資料再以對應的格式
06/01 00:09, 38F
→
06/01 00:09, 1年前 , 39F
返回。之所以說這兩個關鍵字並不是他所要的答案，是因為他
06/01 00:09, 39F
→
06/01 00:11, 1年前 , 40F
（JavaScript 或者 AJAX）的角色與功能，是獲取別人寫好的
06/01 00:11, 40F
→
06/01 00:11, 1年前 , 41F
內容，並且也有其他方式是可以不需要透過 AJAX 就能達到原
06/01 00:11, 41F
→
06/01 00:11, 1年前 , 42F
Po 期望的動態返回內容
06/01 00:11, 42F
→
06/01 03:06, 1年前 , 43F
H大…太多了 受寵若驚 我會慢慢消化的
06/01 03:06, 43F
→
06/03 00:06, 1年前 , 44F
看你的發文 你已經有把問題抽象化的能力 所以你應該可
06/03 00:06, 44F
→
06/03 00:07, 1年前 , 45F
以從chatgpt輕易地得到你想要的答案 多多和chatgpt培養
06/03 00:07, 45F
→
06/03 00:07, 1年前 , 46F
感情吧
06/03 00:07, 46F
推
06/24 23:29, 1年前 , 47F
動態生成就是一個容器根據id取得指定內容 顯示到介面
06/24 23:29, 47F
‣ 更多 xxzrainy 的文章
文章代碼(AID): #1aTZ7TNz (Web_Design)
Web_Design 近期熱門文章
更多 近期熱門文章 >>
PTT數位生活區 即時熱門文章
更多 即時熱門文章 >>
‣ 更多 xxzrainy 的文章
文章代碼(AID): #1aTZ7TNz (Web_Design)