2014第9周三

今天早上继续调试了页面tabs切换问题，各种尝试还不行，后来问了同事调用tabs（）方法我只需要在页面中包含jquery.js、bootstrap.js即可，包含后不用我调tabs()函数，直接点击标签页就可以切换，这让我再次注意并下定决心要学习下bootstrap.js，看了些网上的教程，没有很深入的了解，只感觉到以后web前端开发会经常用到它。本周余下空闲时间要继续学习并总记下bootstrap。

Web标准化的实质：结构、表现、行为的分离。而不是三者的混合，比如<a href="index.html" title="首页" onmouseover="highLight(this)" style="font-weight:bold;color:red">返回首页</a>，符合web标准的html应该是这样：<a href="index.html" title="首页">返回首页</a>，把css放到外部css文件里去，鼠标滑过的效果放到外部js里去，为网页元素附加事件，这属于行为，应该是javascript的职责范围。不应该放到文档结构里。

web标准化的精髓并不是为了抛弃表格，或者浏览器兼容，或者通过w3c校验，而是为了“结构、表现、行为分离”，好处是加载速度快、易于维护、搜索引擎友好、减少带宽占用、利于团队分工合作……

CSS规则如何影响你的页面元素呢？有时候用到ID，有时候用到class。如果页面充满了ID和class，那么实际上分离得就不怎么彻底，因为你的页面上仍然有大量的ID或者class实际上是为了样式表现而存在的，他们并不是文档结构本身的要求。很多时候我们需要和用户交互，于是要给页面上的元素添加“onclick”，“onchange”，“onmouseover”等属性，这些属性编写在页面文档中，依赖于外部javascript。一旦外部的javascript被拿走，页面就出现执行脚本错误，甚至完全不能正常阅读。在这种情况下，javascript实际上和xhtml就没有能够解除耦合。实际上，由于只有xhtml、css、javascript三者存在，我们不可能在网页开发中引入“面向接口编程”之类的设计模式。那么，我们所谓的彻底分离，其实从三者分离的最根本目的来说，就是要实现xhtml对另外两者不依赖。即使去除了所有的css和javascript，xhtml本身也能很好地完成自己的职责——文档结构。

学习css的三大最重要问题是：盒模型、定位、浮动。因为这三块的内容决定了css布局的能力。但xhtml要实现和css的解耦，就要尽量不依赖于css（或者说不要纯粹为了给css预留接口而添加不必要的class和id），那么，在用css布局之前，其实就有一个更紧迫的任务摆在我们的面前CSS的选择器——如何将css规则准确应用到目标元素。

• 元素选择符（例如：body 、a 、li ）
• ID选择符（例如：#head、#body、#foot）
• 类选择符（例如：.red、.item、.content）

• 后代选择符（例如 #head .menu、#foot #copyright）
• 伪类选择符（例如 a:hover、a:link）