Web 技术研究所

我一直坚信着,Web 将会成为未来应用程序的主流

没有 CSS class 才是更严谨的前端开发模式

  从我学 Web 开始就非常讨厌 CSS 的 class 。因为它没有命名空间,所有 class 都是全局的,项目大了就很容易冲突。所以前端项目才需要各种框架,要不然项目一大就玩不起了。其实当初 CSS 把这个概念命名为 class 是非常正确的,它就是 class 嘛,只不过 CSS 做得太烂。
  想想 OOP 中的 class 吧,如果所有 UI 部件都是一个 class,它们之间通过继承来构成一套完整的体系,这是完全没问题的(我最近做的几个项目都一直在尝试 CSS 的无 class 化,事实证明可行)。举个例子吧,假如有个文章列表,在 HTML 部分使用 UL/LI 来布局。大概就会有这样的 HTML
<ul class="articlelist list"> <li class="articleist-item item"> <!-- ... --> </li> <!-- ... --> </ul>   项目中可能有对这类列表设置的通用样式类 list,然后还有为当前文章列表设置的样式类 articlelist。里面的项目也有通用样式类 item,并且也有文章列表项的样式类 articleist-item(这个可以用子元素选择器,但如果 li 内部结构复杂的话使用子选择器就不太好了)。
  这样的列表结构已经算是非常简单的了吧?但是用 CSS 的 class 写出来还是非常累也难以理解。而且 CSS 和 HTML 是分离的,如果 HTML 用错了元素可能也会带来各种问题。比如上面的类本来是用于 UL/LI 结构的,如果被错误的用到 DL/DT/DD 或 TABLE/TR 上就会出问题。
  好吧,我们丢掉传统 Web 那傻逼的套路,用 OOP 来尝试下?比如这样的概念?
class ArticleList extends List { // ... } class ArticleListItem extends Item { // ... } <ArticleList> <ArticleListItem> <!-- ... --> </ArticleListItem> <!-- ... --> </ArticleList>   没有了 CSS 的 class,没有了 CSS 那神奇的选择器优先级问题,全靠 OOP 的类继承和属性重新来实现样式,结构就变得非常清晰。而且程序语言的 class 是可以用命名空间、依赖管理等各种配套设施的。如果把这些都用上,无 CSS class 的前端项目会比传统的模式更加严谨。
  另外,我们一直想要对 Web 组件化,实际上如果在所有当你想用 CSS class 的时候都将其做成一个 js 或其他预处理语言的 class,那么自然而然地就模块化了,不需要再刻意考虑模块化的问题。
  快丢掉传统的 html/css/js 模式吧?
网名:
3.80.32.*
电子邮箱:
仅用于接收通知
提交 悄悄的告诉你,Ctrl+Enter 可以提交哦
神奇海螺
[查看全部主题]
各类Web技术问题讨论区
发起新主题
本模块采用即时聊天邮件通知的模式
让钛合金F5成为历史吧!
次碳酸钴的技术博客,文章原创,转载请保留原文链接 ^_^