Tampermonkey脚本过滤Google Play订单历史$0.00记录失效排查

需要查询Google Play账号下的过往购买记录时，订单历史页面会展示所有领取过的内容，包含大量标价为$0.00的免费应用，且该页面原生未提供任何筛选功能。自行编写的简易Tampermonkey脚本用于自动过滤$0.00记录，但运行后未达到预期效果，当前已编写的脚本代码如下：

// ==UserScript==
// @name         Filter Out $0.00 Garbage
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  ...
// @author       Me
// @match        https://play.google.com/store/account/orderhistory
// @icon         https://www.google.com/s2/favicons?sz=64&domain=google.com
// @grant        none
// ==/UserScript==

(function() {
  var ele = document.getElementsByClassName('mshXob');
  for (var i = 0; i < ele.length; ++i) {
    var item = ele[i];
    if (item.innerHTML == '$0.00') {
      var gp = item.parentNode.parentNode.parentNode;
      gp.style.display = 'none';
    }
  }
})();

核心失效原因 #

• 执行时机错误：Google Play的订单列表为前端异步动态渲染，当前脚本在页面初始加载阶段就立即执行，此时价格节点还未被渲染到DOM树中，getElementsByClassName拿到的是空集合，过滤逻辑根本不会触发。
• 匹配逻辑容错率极低：直接用innerHTML == '$0.00'做严格相等判断完全无法适配实际页面结构，价格节点内部可能嵌套无障碍标签、span子元素，或者价格前后存在空白字符、不同地区货币符号差异，都会导致匹配失败。
• DOM层级硬编码过于脆弱：通过连续三次取parentNode向上查找订单容器的写法完全依赖当前页面的DOM嵌套结构，只要前端调整一层节点嵌套，就会找错待隐藏的元素，甚至触发JS报错中断脚本运行。
• 未覆盖动态加载内容：订单历史页采用滚动分页加载逻辑，就算初始加载的内容过滤成功，后续下滑加载出的新订单不会被脚本处理。

修正方案 #

针对以上问题调整脚本逻辑即可：

1. 增加DOM加载完成判断，确保初始节点渲染后再执行过滤
2. 改用textContent提取价格文本做匹配，不依赖innerHTML的完全相等，兼容不同格式的0元标识
3. 用closest()方法向上查找订单容器，替代硬编码的父节点层数遍历
4. 增加DOM变动监听，自动处理后续异步加载、滚动分页生成的新订单节点

修正后的可运行代码如下：

// ==UserScript==
// @name         Filter Out $0.00 Garbage
// @namespace    http://tampermonkey.net/
// @version      0.2
// @description  自动过滤Google Play订单历史0元免费记录
// @author       Me
// @match        https://play.google.com/store/account/orderhistory
// @icon         https://www.google.com/s2/favicons?sz=64&domain=google.com
// @grant        none
// ==/UserScript==

(function() {
  'use strict';
  function filterZeroOrders() {
    document.querySelectorAll('.mshXob').forEach(priceEl => {
      const priceText = priceEl.textContent.trim();
      // 匹配所有0元价格，兼容不同货币格式
      if (/^[^1-9]*0\.00[^1-9]*$/.test(priceText)) {
        // 向上查找最近的订单行容器，可根据实际页面DOM调整选择器
        const orderRow = priceEl.closest('[data-order-id], .order-item, .U8f25d');
        if (orderRow) orderRow.style.display = 'none';
      }
    })
  }

  // 初始加载执行
  document.readyState === 'loading' 
    ? document.addEventListener('DOMContentLoaded', filterZeroOrders)
    : filterZeroOrders();

  // 监听DOM变动，处理动态加载内容
  new MutationObserver(filterZeroOrders).observe(document.body, {
    childList: true,
    subtree: true
  });
})();

如果运行后还是有漏过滤的0元记录，打开浏览器开发者工具检查对应价格节点的实际class、订单行容器的选择器，替换代码中对应的选择器字符串即可。

内容的提问来源于stack exchange，提问作者user4806122