续英语真题web的功能
本帖最后由 smilinghan 于 2024-4-13 13:59 编辑上次看到一篇文章 hualy 大佬 写的文章感觉太🐂了 ，这次偶然发现这个虽然这篇没有什么技术含量，但感觉这个功能还是有点用处，便来记录一下。
上一篇讲述取消限制使用查询功能，这篇揪出了一个读音速度控制功能，废话不多直接上成果！
这里涉及到 XPath 查询、修改元素属性、使用 MutationObserver 以及创建和添加按钮到页面。
(function() {
const xpath = '/html/body/div/div/div/div/div';
// 要修改的属性名
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
看着不错呀，有时间我也试试 好厉害，楼主
页:
[1]