求助关于css以及js文件目录结构的最佳实践!!!!

入行刚刚半年,工作中一般都是如下结构,特别是css,style里面后面越写越多,前面用过的类名都记不清楚了,有些页面又有些细微的差异需要区分,目前用的办法是在每个页面的body上添加一个唯一的id,然后在style.css里面区分开来,js的话,有些页面代码很少,但是也写在main.js里面了,然后又每个页面都引入了一边,css的style.css也是每个页面都引入,感觉好恶心啊,有什么好点的建议吗?

app
   --css
        --reset.css
        --public.css
        --style.css
   --js
        --jquery.js
        --main.js
   --imgages
   
   index.html
   about.html
   contact.html
   order.html
   completeorder.html

所有页面公用的js和css放在common里,针对个别页面的css的样式,单独写在这个页面对应的同名css文件里,只这个页面引用即可。

前几年我也为这件事纠结苦恼过。。。直到我研究了各别的CSS和JS框架之后。。。。

CSS 方面,用 SCSS 吧

加 id 区分开的方法,还不如干脆分几个 CSS 文件出来

通用的样式单独一个 base.css

JS 那边也是一样。

使用sass/Less+模块化管理,推荐自动化工具fis,简单高效

谢谢邀请。嗯,这确实是个问题。命名上尽量保证名称和对应的功能区相对应,这样也好记忆,不过呢对于公共的css或者js之类的还是不要分文件的好,你可以采用压缩的。然后根据页面的不同引用不同的css或者js,这样也能减少页面的加载。在或者你使用第三方类库之类的有比较全面的cssjs库也行。

顶一下,我也是为这个问题苦恼了很久,不知道要怎么去做

  • browser-sync-webpack-plugin proxy 模式下, 如何指定不进行 proxy 的文件?
  • 如何对网页进行兼容性测试?和解决浏览器之间的兼容性问题?
  • jquery列表隐藏显示怎么进行遍历?
  • 如何实现点击链接 A 弹出窗口 X,点击链接 B 继续在弹出窗口 X (刷新)打开?
  • JSP的JS文件头部为什么要加<script type="text/javascript">标签?
  • Vue键盘事件为何要加上native?
  • 想写一个入口函数 只要调用这个入口函数 之前没有执行完毕的函数都不再执行 缓存也要清掉 不知道咋弄?
  • iOS 与 js 交互,如果页面很简单的话,js掉用iOS的方法会显示,方法未定义?
  • JavaScript函数的多种定义方法与其区别是什么?
  • echarts怎样显示出所有图例综合的最大值最小值?
  • var o = {a:1}; var b = Object(o); 和 var b = o 有什么不同?