Elementor绝对URL生成当前菜单项高亮CSS，如何用jQuery正确移除？

你之前的jQuery代码没有生效，是因为css('color','')只是清空了元素的内联color样式，清空后元素仍然会匹配Elementor自动生成的高优先级外部CSS规则，所以样式还是会生效。

解决方法 #

方法1：直接用内联样式覆盖（最简单） #

直接给目标元素设置你需要的color值，内联样式优先级高于外部类选择器规则，会直接覆盖自动生成的CSS：

// 把颜色值替换为你需要的导航默认颜色，也可以填inherit继承父级颜色，或者unset重置
$(".elementor-3440 .elementor-element.elementor-element-8fae002 .elementskit-navbar-nav > li.current-menu-item > a").css('color', 'unset');

方法2：彻底删除指定CSS规则 #

如果要完全移除Elementor生成的这条规则，可以遍历样式表匹配后删除：

$(document).ready(function() {
  // 遍历页面所有样式表
  for (const sheet of document.styleSheets) {
    try {
      const rules = sheet.cssRules || sheet.rules;
      for (let i = 0; i < rules.length; i++) {
        // 匹配到目标选择器就删除该规则
        if (rules[i].selectorText === '.elementor-3440 .elementor-element.elementor-element-8fae002 .elementskit-navbar-nav > li.current-menu-item > a') {
          sheet.deleteRule ? sheet.deleteRule(i) : sheet.removeRule(i);
          i--; // 修正索引避免跳过后续规则
        }
      }
    } catch (err) {
      // 跨域加载的外部样式表会触发权限报错，直接跳过即可
    }
  }
});

方法3：自定义CSS覆盖（无需JS） #

不需要写JS的话，直接在Elementor后台的「自定义CSS」区域添加以下规则即可，优先级高于原有自动生成的CSS：

.elementor-3440 .elementor-element.elementor-element-8fae002 .elementskit-navbar-nav > li.current-menu-item > a {
    /* 这里填你需要的颜色，或者用unset重置为默认值 */
    color: unset !important;
}

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