This script highlights differences on the device comparison page on Apple's website. Paste it into the developer tools console and run it. This script was generated by ChatGPT.

apple_compare_highlight.js

(() => {
  // --- Custom Styles ---
  const STYLE_ID = 'compare-diff-style-2';
  if (!document.getElementById(STYLE_ID)) {
    const style = document.createElement('style');
    style.id = STYLE_ID;
    style.textContent = `
      .diff-yellow {
        background: rgba(255, 255, 150, 0.8) !important;
      }
      .diff-green {
        background: rgba(100, 255, 100, 0.8) !important;
      }
    `;
    document.head.appendChild(style);
  }

  const rows = document.querySelectorAll('.compare-row');
  rows.forEach(row => {
    const cells = Array.from(row.querySelectorAll('div[role^="cell"], .compare-column'))
      .filter(el => el.closest('.compare-row') === row);
    if (cells.length < 3) return; // Only apply when there are 3 or more columns

    // Normalize text
    const values = cells.map(c => (c.innerText || '').replace(/\s+/g, ' ').trim());

    // Clear existing highlights
    cells.forEach(c => c.classList.remove('diff-yellow', 'diff-green'));

    // Check for differences in the 2nd cell
    if (values[1] !== values[0]) {
      cells[1].classList.add('diff-yellow');
    }

    // Check for differences in the 3rd cell
    if (values[2] !== values[0]) {
      if (values[2] === values[1]) {
        cells[2].classList.add('diff-yellow');
      } else {
        cells[2].classList.add('diff-green');
      }
    }
  });

  console.log('Conditional highlighting applied.');
})();