線上購買 groceries 是在零售商的網站或應用程式中挑選 grocery 項目，並安排取貨或外送，而不是親自走進商店走道。最有用的第一步，是在打開任何購物車之前，先建立一份乾淨、私密的清單，列出你真正需要的東西。這份清單能讓你的採買計畫在農產品、乳製品、烘焙、肉類、儲藏食品、冷凍食品以及家庭用品等類別中保持井然有序，還能抓出像「Milk」和「milk」這種意外重複的項目，並提供一個純文字版本，讓你可以貼到任何零售商的搜尋欄、備註欄，或分享給另一半。手中握有結構化的清單後，線上購買 groceries 就會變成一項快速掃描並確認的工作，而不是一趟輕易讓訂單金額翻倍的無目的閒逛。線上 grocery 清單工具是一個以瀏覽器為基礎的小型清單，正好用來處理這個規劃步驟，無需帳號、無需雲端同步、無需安裝應用程式，只將清單儲存在你目前使用的瀏覽器本機。
在你按下「下單」之前，線上購買 groceries 真正代表什麼
線上購買 groceries 涵蓋了一切形式，從全國連鎖店提供的預約外送，到僅限取貨的服務，再到為你代購的第三方應用程式。它們之間共同的特點是:在某個時間點，你會在購物車中輸入或點選你想要的東西。無論你是開車去取貨，還是請人送到門口，你花在規劃上的時間，才是決定這趟採買是省力還是添堵的關鍵。
正因如此，規劃步驟值得擁有專屬的工具。經常線上購物的人往往每週都得重複同樣的心智工作:走進廚房、檢查儲藏室、在信封背面草草寫下半張清單，然後因為應用程式秀出一張照片而多加了三樣衝動性商品。一份結構化的清單能消除這種重蹈覆轍的過程，為每一次採買提供同樣可重複的起點。
為什麼私密瀏覽器清單勝過便利貼與筆記應用程式
一份只存在於你目前瀏覽器中的私密清單，具備其他規劃方法所欠缺或需要付費才有的三項特性。它不需要登入，不會把你的購物習慣上傳到第三方雲端，而且能產生一份可直接貼到任何零售商的剪貼簿就緒文字版本。心智筆記在結帳前的比較步驟就會失效。紙本清單會在廚房與商店之間不慎遺失。手機筆記應用程式需要帳號，通常會同步到廠商的伺服器，並儲存你曾經寫過的每一份清單。
線上 grocery 清單將計畫保留在你的裝置上。根據 MDN 關於 Window.localStorage 的說明文件，localStorage 是一個按來源 (per-origin) 區分的鍵值儲存，會在該瀏覽器設定檔中於頁面重新載入後持續保存，這正好符合一趟採買所需的本機、輕量持久化機制。
| 方法 | 需要帳號 | 雲端同步 | 類別 | 重複項目防護 | 剪貼簿匯出 |
|---|---|---|---|---|---|
| 心智筆記 | 否 | 否 | 否 | 否 | 否 |
| 紙本清單 | 否 | 否 | 否 | 否 | 否 |
| 手機筆記(預設) | 經常需要 | 是 | 否 | 否 | 有時候 |
| 試算表 | 否 | 選用 | 手動 | 手動 | 手動 |
| 瀏覽器清單(線上 grocery 清單) | 否 | 否 | 是(內建 8 個) | 是(不區分大小寫) | 是(一鍵完成) |
用三個步驟建立你的線上 grocery 清單
整個流程刻意設計得很短:規劃、編輯、複製。以下是具體順序。
- 在你目前的瀏覽器中開啟「線上 grocery 清單」。在輸入欄位中輸入品項名稱，從下拉選單中選擇八個類別之一(農產品、乳製品、烘焙、肉類、儲藏食品、冷凍食品、家庭用品，或其他)，然後新增。名稱會自動去除前後空白並壓縮內部空白，因此「 Milk 」會變成「Milk」，而第二次新增的「milk」會因重複而被拒絕，而不是產生兩列。
- 為計畫中的每個品項重複此步驟。清單最多可容納 100 個不重複的品項，每個品項名稱上限為 80 個 Unicode 碼點，以確保在手機與桌機上的顯示與剪貼簿輸出都能保持一致。
- 當你線上購物時，請勾選已放入購物車的列。若要移除不再需要的單一項目，請使用該列的移除控制項。若要重設此次採買，可一鍵清除所有已勾選的列，而未勾選的列則會維持原本的順序。
購物時管理品項
介面刻意將「新增」與「編輯」分開。新增是規劃步驟;編輯則是在另一個分頁中購物車已開啟時所進行的步驟。每個品項都帶有一小組欄位:你輸入的名稱、一個介面類別、一個已購買旗標，以及一個由瀏覽器產生的識別碼。除此之外不會儲存任何東西，包括不儲存價格、數量、替代偏好，以及品牌。
正是這個精簡的資料模型，讓工具能保持可預測的行為。切換已購買核取方塊時，只會寫入那單一的旗標。「清除已購買」會移除所有已勾選的列，並保留未勾選的列在原本的順序，這表示你在購物車頁面上的掃描順序會與你規劃時的順序一致。移除一列並不會重新排列其餘的列。沒有任何隱藏的排序、類別重新分組、價格計算、數量運算、推薦引擎，或自動庫存行為。
將清單複製到剪貼簿，以用於任何零售商
一旦計畫設定完成，複製動作會以固定格式將每個品項一行一行地寫入剪貼簿。未勾選的列以 [ ] 開頭，已勾選的列以 [x] 開頭，所選的類別接在破折號之後。因此一份全新的清單可能會像這樣:
[ ] Apples — Produce [ ] Milk — Dairy [x] Bread — Bakery [ ] Chicken breast — Meat這段純文字區塊可以乾淨地貼到零售商的備註欄、搜尋欄、傳給另一半的簡訊，或文件中。瀏覽器會在頁面顯示成功訊息前先確認寫入動作;若權限遭拒，頁面會告訴你手動選取可見的清單，並使用鍵盤快速鍵複製。這個實作仰賴 MDN 上有文件記載的標準 Clipboard writeText 方法，這也是為什麼成功訊息只會在瀏覽器實際接受寫入後才出現。
這個工具刻意不做的事
值得明列這份清單並未聲稱能做的事，因為其中幾項功能出現在類似的工具中，可能會誤導購物者。
- 它不會計算價格、總成本，或進行單位比較。每筆計畫僅包含名稱、類別，以及已購買旗標，僅此而已。
- 它不會合併數量。如果你輸入「2 Apples」與「Apples」，兩者會分別以獨立的文字儲存。工具不會推測第二筆是第一筆的數量。
- 它不會將相關詞彙視為相同。「Apple」與「apples」是不同的項目;重複檢查是精確、不區分大小寫，並以你輸入的去除空白後文字為準。
- 它不會推測替代品或建議其他選項。介面絕不會告訴你，也許你會偏好不同的品牌。
- 它不提供飲食、過敏、健康、預算，或食品安全方面的指引。請自行核對標示與個人需求。
儲存限制及其對你清單的意義
清單儲存在一個有版本編號的 localStorage 鍵之下。每次載入時，解析器僅接受結構上有效的列組，會拒絕超出 100 項上限的儲存項目，並捨棄格式錯誤的列。無效的 JSON 會產生空白清單，而不是當機。這表示即使另一個分頁或擴充功能將未預期的資料寫入同一個鍵，工具仍能保持可預測的行為。
本機瀏覽器儲存雖然方便，但它並非備份或同步服務。清除網站資料、使用隱私瀏覽、換用瀏覽器、更換裝置，或瀏覽器的清理政策，都可能會移除這份清單。這個工具沒有雲端還原、沒有分享連結、沒有多人編輯、沒有登入、沒有通知，也沒有跨裝置同步。任何能存取同一部裝置上同一個瀏覽器設定檔的人，都可能看到本機儲存的項目，因此請勿將密碼、付款資訊、醫療細節，或其他敏感資料放在瀏覽器儲存中。預期的用途包括一趟購物行程、儲藏室備忘、家用品補貨，或一份簡單的快速檢查清單。
一覽八個類別
下拉選單是一個有限的介面組織選擇，並非營養標準、商店分類法，也並非主張每項產品該歸類於何處。當這個簡單的分類不適用時，請使用「其他」。
| 類別 | 典型內容 |
|---|---|
| 農產品 (Produce) | 新鮮水果、新鮮蔬菜、新鮮香草 |
| 乳製品 (Dairy) | 牛奶、起司、優格、奶油 |
| 烘焙 (Bakery) | 麵包、捲餅、薄餅、各式烘焙食品 |
| 肉類 (Meat) | 牛肉、雞肉、豬肉、魚肉 |
| 儲藏食品 (Pantry) | 罐頭食品、乾貨、油品、調味料 |
| 冷凍食品 (Frozen) | 冷凍蔬菜、冷凍料理、冰淇淋 |
| 家庭用品 (Household) | 清潔用品、紙製品、個人護理 |
| 其他 (Other) | 任何不適用上述簡單分類的項目 |
從一個空白頁面到一份已複製好的購物計畫，整個流程都裝得進一個瀏覽器分頁。你輸入、標記、勾選，然後貼上。沒有任何資料離開你的裝置，沒有任何地方要求你註冊，清單本身也不需要比即將下單的這趟採買存活得更久。
想進一步了解，請參閱 線上購買 groceries 應用程式?其實就是一份私密瀏覽器清單。