要 hook 所有对 <base> 标签的 href 属性赋值操作，可以通过以下几种方式来实现：
- 使用
MutationObserver监视 DOM 变化。 - 重写
setAttribute方法。
下面是这两种方法的示例代码。
方法 1：使用 MutationObserver
// 创建一个观察者实例const observer = new MutationObserver((mutations) => {mutations.forEach((mutation) => {mutation.addedNodes.forEach((node) => {if (node.tagName === 'BASE') {// 当 base 标签被添加时，记录 href 的设置console.log(`Base tag added: ${node.href}`);}});// 如果属性发生了变化，检查是否是 href 属性if (mutation.type === 'attributes' && mutation.attributeName === 'href') {const baseTag = mutation.target;console.log(`Base href changed to: ${baseTag.href}`);}});});// 配置观察者选项const config = { attributes: true, childList: true, subtree: true };// 启动观察器并监视文档observer.observe(document, config);// 如果页面上已经存在 <base> 标签，手动触发一次检测const existingBaseTags = document.getElementsByTagName('base');for (let i = 0; i < existingBaseTags.length; i++) {console.log(`Existing base href: ${existingBaseTags[i].href}`);}
方法 2：重写 setAttribute 和属性访问
(function() {const originalSetAttribute = HTMLBaseElement.prototype.setAttribute;HTMLBaseElement.prototype.setAttribute = function(name, value) {if (name.toLowerCase() === 'href') {console.log(`Setting base href to: ${value}`);}return originalSetAttribute.call(this, name, value);};// 检查当前页面是否已有 <base> 标签并记录其 href 属性const existingBaseTags = document.getElementsByTagName('base');for (let i = 0; i < existingBaseTags.length; i++) {console.log(`Existing base href: ${existingBaseTags[i].href}`);}})();
总结：
- MutationObserver 方法可以监控任何对 DOM 的变化，包括元素的添加和属性的修改，这样即使是在异步情况下也能捕捉到
<base>标签的更改。 - 重写 setAttribute 方法则可以直接拦截所有通过 JavaScript 修改属性的操作。
你可以根据需要选择适合的方法来实现你的功能。
内容由零声教学AI助手提供，问题来源于学员提问
