网页头部JavaScript文本替换代码纠错及修复请求

Hey there, let's get that JavaScript code sorted out. Those JSLint errors are all tied to regex syntax, which JSLint is pretty strict about—here's how to fix each one and get your text replacement working correctly.

Breaking Down the Errors #

First, let's unpack the JSLint warnings you're seeing:

• 2x "Expected '\s' and instead saw ' '": JSLint favors using the \s regex token (which matches any whitespace: space, tab, newline) over literal spaces in regex patterns. It's more consistent and handles edge cases better.
• 1x "Expected '/'": This means your regular expression wasn't properly closed. JavaScript regex literals need to be wrapped between two / characters (like /pattern/), plus any modifiers (like g for global replacement) at the end.

Corrected Code #

Here's the fixed version that addresses all JSLint issues and does exactly what you need—replacing every instance of "Ashen Glow Gaming" with your formatted content:

// Replace all occurrences of "Ashen Glow Gaming" with styled content
document.body.innerHTML = document.body.innerHTML.replace(/Ashen\sGlow\sGaming/g, '<span class="custom-style">$&</span>');

What Changed & Why? #

1. Swapped literal spaces for \s: Instead of writing Ashen Glow Gaming in the regex, we used Ashen\sGlow\sGaming. This fixes those two JSLint errors and makes the regex more flexible—it'll match any whitespace between the words, not just single spaces.
2. Properly closed the regex: We wrapped the pattern in /.../ and added the g modifier (critical for replacing all instances, not just the first one). That fixes the "Expected '/'" error.
3. Used $& for cleaner code: The $& in the replacement string refers directly to the matched text, so we don't have to type "Ashen Glow Gaming" twice. It's shorter and less likely to have typos.

Bonus: Safer Alternative (Avoid Breaking Event Listeners) #

A quick heads-up: Using innerHTML can wipe out any event listeners attached to elements on your page. If that's a problem, here's a safer way to replace text without breaking existing functionality:

function replaceTextAcrossPage(searchRegex, replacementHTML) {
  function traverseNodes(node) {
    if (node.nodeType === Node.TEXT_NODE) {
      // Split text node into parts around matches
      const parts = node.textContent.split(searchRegex);
      if (parts.length > 1) {
        const parent = node.parentNode;
        parent.removeChild(node);
        parts.forEach((part, index) => {
          if (index > 0) {
            // Create the styled span for the matched text
            const span = document.createElement('span');
            span.outerHTML = replacementHTML.replace('$&', searchRegex.source);
            parent.appendChild(span);
          }
          if (part) {
            parent.appendChild(document.createTextNode(part));
          }
        });
      }
    } else if (node.nodeType === Node.ELEMENT_NODE && !['SCRIPT', 'STYLE'].includes(node.tagName)) {
      // Recurse through child nodes, skipping scripts/styles
      Array.from(node.childNodes).forEach(traverseNodes);
    }
  }

  traverseNodes(document.body);
}

// Use the function with our pattern and replacement
replaceTextAcrossPage(/Ashen\sGlow\sGaming/g, '<span class="custom-style">$&</span>');

This version traverses only text nodes and inserts HTML elements without overwriting the entire innerHTML of the body, so your event listeners stay intact.

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