跳至內容
- 選擇項目後,整個頁面將重新整理。
- 在新視窗中開啟。
document.addEventListener("DOMContentLoaded", function() {
// 鎖定該 App 產生的折扣 Class
const appElementSelector = '.discounts__discount';
const myBanner = document.querySelector('.promo-banner-wrap');
if (!myBanner) return;
// 1. 初次檢查:如果網頁一載入時折扣就已經存在
if (document.querySelector(appElementSelector)) {
myBanner.style.setProperty('display', 'block', 'important');
return;
}
// 2. 動態監聽:當顧客加入購物車、折扣動態跳出來時觸發
const observer = new MutationObserver((mutations, obs) => {
const appElement = document.querySelector(appElementSelector);
if (appElement) {
myBanner.style.setProperty('display', 'block', 'important');
// 注意:這裡先不中斷監聽(不使用 disconnect),
// 因為顧客如果把商品拿掉、折扣消失時,我們希望 Banner 也能同步隱藏。
} else {
// 如果折扣元素消失了,就把 Banner 再次隱藏
myBanner.style.setProperty('display', 'none', 'important');
}
});
// 開始監聽整個頁面的 HTML 變動
observer.observe(document.body, {
childList: true,
subtree: true
});
});