
158 第四章
調整
DOM
replaceWith 並不適合所有狀況
replaceWith 方 法 在 你 需 要 進 行 一 對 一 替 換 時 可
以 運 作 得 很 好, 例 如, 交 換 hamburger 類 別 與
portbello 類別。
多對一替換
多對一替換
然而,檢 查 清 單的下一 個 項 目的元素 交
換並非 一 對 一,我們必 須 使 用一種材 料
成 分 ( 豆 腐 ) 替 換 多 種 不 同 的 材 料 成 分
( 亦即,火雞,蛋,牛排,羊肉 )。
一對多替換
一對多替換
我們可以取出 meat
類別的元素,並且
用豆腐替換它們。
但是,當 我 們 想要選擇 豆 腐 並且在稍 後
替換它 時, 會 碰到一個 問 題。 當我們想
要 將 不 同 種 類 的「肉」
【譯 註】
放 回 去 時,
DOM 已經忘記它們了。
我們可以只用一種「肉」替換豆腐,但那
樣根本不是我們想要的。
因此,我們必須用兩個步驟完成這個菜單
替換工作︰
稍後,DOM 已經
忘了所有不同種
類的「肉」。
將
tofu
類別的
li
元素插入
DOM
裡
頭
meat
類別的元素後面。
解除
meat
類別的元素並且將它們
儲存在變數中。
一對一替換
?
?
?
4
譯註提醒讀者,在此「肉」指的是 hamburger 和 fish
之外的所有葷食材料。
1
2