javascript - 将 CSS "#"(ID) 替换为 .(Class)

Question

我有一个像这样的 CSS 字符串

    #xyz{
          color:#ee2ee2;
      }
     .abc{
        background-color:#FFFFFF;
        border-color:1px solid #eee;
     }
    .def #xyz{
       border-color:1px solid #ddd;
    }

我需要用 .xyz 替换 #xyz(或任何其他 ID 选择器)而不更改 color:#ee2ee2(或任何其他颜色选择器)。基本的 java 脚本代码就可以了

我已经尝试了一些正则表达式，但它在一些情况下失败了

cssText.replace(/#([a-zA-Z])/gm, '.$1');

Answer 1

这将用 替换 #。 仅当在同一行之后的某处有 { 时。

cssText = `
  #xyz
  {
     color:#ee2ee2;
  }
  .abc{
     background-color:#FFFFFF;
     border-color:1px solid #eee;
  }
  .def #xyz{
     border-color:1px solid #ddd;
  }
  body{background-color:#fff000;}.ig26{padding:20px;}.icts{width:200px;height:200px;padding:10px;} 
`;
console.log(cssText.replace(/#([a-zA-Z])(?=[^}]*{)/g, '.$1'));