与内容无关的类名
从某个设计模式的结构与功能中提取类名的语义是一种更好的方法。那些类名与内容无关的组件可重用性更高。
我们不应该害怕让各层之间的关系变得清晰而明确(这里应该是指结构层、内容层等,译者注),而不是用类名严格地反应明确的内容。这样做不会使类名“无语义”,这只是表明它们的语义并不取决于内容。我们也不应该害怕使用额外的HTML元素,只要它们能帮助你创建更强壮、更灵活且更具重用性的组件。这样做不会使HTML变得“无语义”,这仅仅意味着你标记内容所使用的元素数量超过了最小值而已。
前端架构
组件、模板、面向对象的体系结构的目的是能够开发出一种数量有限的可重复使用的组件,它可以在一定范围内包含不同的内容类型。在大型的应用程序中,对类名语义来说最重要的事情是,能够用实用主义服务于它们的主要目的 —— 提供有意义的、灵活的、可重复使用的表现或行为的钩子供开发者使用。
可重用且可组合的组件
总的来说,可扩展的HTML/CSS必须依赖HTML中的class,以便创建可重用的组件。一个灵活的、可重用的组件,既不依赖DOM树中的某一部分,也不需要使用特定类型的元素。它应该能适应不同的容器,并且可以很容易地更换主题。如果有必要,额外的HTML元素(超出标记内容所必须的元素之外的元素)可以让组件更加强壮。Nicole Sullivan所说的media object就是一个很好的例子。
避免用类型选择器支持class,可以让组件更容易合并。下面这个例子中,btn组件与uilist组件不易于合并。问题在于.btn的权重比.uilist a要小(这将覆盖任何共享属性)。而且ulist组件需要锚点作为子节点。
|
|
一种让uilist组件与其它组件轻松组合的方法是,uilist的子级DOM元素用class来添加样式。尽管这会降低权重,但是它的主要好处在于,它为你提供了处理子节点的任何结构样式的选择权。
|
|









