续英语真题web的功能

smilinghan

上次看到一篇文章 hualy 大佬 写的文章感觉太🐂了 ，这次偶然发现这个虽然这篇没有什么技术含量，但感觉这个功能还是有点用处，便来记录一下。

上一篇讲述取消限制使用查询功能，这篇揪出了一个读音速度控制功能，废话不多直接上成果！







这里涉及到 XPath 查询、修改元素属性、使用 MutationObserver 以及创建和添加按钮到页面。

[JavaScript] 纯文本查看 复制代码

(function() {
  const xpath = '/html/body/div[2]/div[4]/div[1]/div/div[2]';

  // 要修改的属性名
  const attributeName = 'aria-hidden';

  const node = document.evaluate(xpath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;

  // 初始状态为 false
  let attributeValue = 'false';

  // 修改属性值函数
  function toggleAttributeValue() {
    attributeValue = (attributeValue === 'false') ? 'true' : 'false';
    node.setAttribute(attributeName, attributeValue);
  }

  // 创建 MutationObserver 实例
  const observer = new MutationObserver((mutations) => {
    for (const mutation of mutations) {
      if (mutation.type === 'attributes' && mutation.attributeName === attributeName) {
        // 属性值被改回 true，重新改为 false
        if (node.getAttribute(attributeName) !== attributeValue) {
          node.setAttribute(attributeName, attributeValue);
        }
      }
    }
  });

  // 启动 MutationObserver
  observer.observe(node, { attributes: true });

  // 创建开关按钮
  const toggleButton = document.createElement('button');
  toggleButton.textContent = '读音速度开关';
  toggleButton.style.position = 'fixed';
  toggleButton.style.top = '50px';
  toggleButton.style.right = '50px';
  toggleButton.addEventListener('click', toggleAttributeValue);

  // 添加按钮到页面
  document.body.appendChild(toggleButton);
})();

1. 在这个脚本中，我们首先定义了一个 XPath 表达式来定位页面中的一个特定元素。然后，我们获取这个元素的引用，并定义了一个函数 `toggleAttributeValue` 来切换该元素的 `aria-hidden` 属性值。

2. 接着，我们创建了一个 `MutationObserver` 实例来监听该元素属性的变化。当 `aria-hidden` 属性的值发生变化时，如果它变回了 'true'，我们将它重新设置为 'false'。这确保了我们始终控制该属性的值。

3. 最后，我们创建了一个按钮元素，并为其添加了一个点击事件监听器，该监听器在点击时调用 `toggleAttributeValue` 函数。这个按钮被添加到页面的 body 中，用户可以通过点击它来切换元素的 `aria-hidden` 属性。

附上 greasyfork  脚本存储点。

https://greasyfork.org/zh-CN/scripts/490620

samleekiller

看着不错呀，有时间我也试试

2367745

好厉害，楼主

donghuanliang

学习！！！！！