谈谈我的“分离”观
作者：Ghost 来源：CSS森林 发布时间：2010-08-31 14:47:00
很久没有跟其他人做重构思想方面的交流了，可能大家都觉得不太好意思讨论，特别是“分离”的思想这么基础的话题，拿出来说怕会被“笑话”。做为页面重构中最基础的一个思想，我们有必要清楚的认识它，因此我们需要更多的讨论。正所谓“理越辩越明”。借着这次webrebuild年会上 焕义 提到的“分离”，我也来谈谈我的“分离”观。
一说到重构的“分离”思想，第一个进入脑残里的是“表现、内容、行为”的分离。“表现”指CSS、“内容”指HTML、“行为”指脚本。然后……
在《 页面重构中的模块化思维 》中我提到了“HTML与CSS的接口”实现，从“接口”可以看出，我们在做页面的时候，把CSS、HTML、脚本等文件独立出来的做法，就是一种“分离”的体现。但只是这样吗？在CSS2.1的时候有这样的认识是正常的，那么CSS3为什么又加入了原本脚本可以实现的动画效果呢？
表现，个人觉得应该包括了像滚动、发光、hover等动画的效果在内，脚本制作的动画效果也应该属于“表现”的范畴；内容，要传达给用户的内容，包括HTML标签；而行为，指由用户触发的由脚本与服务器端的交互，如登录。
举个例子，比如用户登录网站的过程中，当前输入框的边框高亮（表现），将鼠标放到登录按钮上，按钮变亮（表现），点击发送输入的内容（行为），界面出现一个进度条或转动的小圈（表现），登录成功，返回（行为）一个成功提示（内容），绿色图标、文字（表现）。
因此，CSS3中增加的动画效果并不像有些人说的，引起表现与行为的混乱。由于目前浏览器还不能做到支持真正意义上的表现、内容、行为分离，很多时候我们需要使用脚本到完成表现的效果。从这个角度来讲，目前脚本所完成的更多是“表现”的东西，而非“行为”。
0
投稿猜你喜欢
- 设计首页的第一步是设计版面布局。就象传统的报刊杂志编辑一样，我们将网页看作一张报纸，一本杂志来进行排版布局。虽然 * 页技术的发展使得我们开
PHP lcfirst() 函数实例把 "Hello" 的首字符转换为小写。:<?php echo lcfirst- IE的特殊性 IE的DOM元素属性与Firefox, Opera, Safari有些不同。在IE中，我们可以给DOM添加任意自定
- template代码：<template> <div class="hello"> <ul
- 如果您还不太了解XML技术，您可以先看看此文：XML的语法、结构以及相关的一些技术 及 XML DOM介绍和例子XML中 CDATA的作用：
- 本文实例为大家分享了Python生成树形图案的具体代码，供大家参考，具体内容如下先看一下效果，见下图。上面这颗大树是使用Python + T
- 方法一：进入MYSQL安装目录 打开MYSQL配置文件 my.ini 或 my.cnf查找 max_connections=100
- 我们来使用background 插入flash播放器播放音乐刚刚乱试一翻搞出这个,有意思吗?请在IE6下测试运行代码框<!DOCTYP
- Plotly Express是对 Plotly.py 的高级封装，内置了大量实用、现代的绘图模板，用户只需调用简单的API函数，即可快速生成
- 本文实例分析了Python中的异常处理try/except/finally/raise用法。分享给大家供大家参考，具体如下：异常发生在程序执
- 用re或者string.find.以下是re代码import re#文本所在TXT文件file = '123.txt'#关键
- 数据库是数据的集合，与数学的集合论有密不可分的关系。为提高查询速度，我们可以：对数据表添加索引，以加快搜索速度;通过编程技巧最大限度地利用索
- 译者 | 豌豆花下猫声明 ：本文获得原作者授权翻译，转载请保留原文出处，请勿用于商业或非法用途。有许许多多文章写了 Python 中的许多很
- 重试指的是当加载出错时，有能力重新发起加载组件的请求。异步组件加载失败后的重试机制，与请求服务端接口失败后的重试机制一样。所以，先来讨论接口
- 我就废话不多说了，大家还是直接看代码吧~func main() { var a chan string a =mak
- 本文实例讲述了Python list列表中删除多个重复元素操作。分享给大家供大家参考，具体如下：我们以下面这个list为例，删除其中所有值为
- Celery 简介除了redis，还可以使用另外一个神器---Celery。Celery是一个异步任务的调度工具。Celery 是 Dist
- 一、伪装浏览器对于一些需要登录的网站，如果不是从浏览器发出的请求，则得不到响应。所以，我们需要将爬虫程序发出的请求伪装成浏览器正规军。具体实
- Django部署到Cenos7需要安装大量的依赖包, 有很多坑需要踩, 这里是踩坑后探索出的标准化步骤实验环境: 腾讯云centos7用ce
- <?php header(“Content-Type:text/html;charset=utf-8″); if (isset($_G
