1. Web标准
- Web标准由一系列标准组合而成，其核心理念就是将网页的结构、样式和行为分离开来，所以它可以分为三大部分：结构标准、样式标准和行为标准。结构标准包括XML标准、XHTML标准、HTML标准；样式标准主要是指CSS标准；行为标准主要包括DOM标准和ECMAScript标准。
- 一个符合标准的网页，标签中的标签名应该全部都是小写的，属性要加上引号，样式和行为不再夹杂在标签中，而应该分别单独存放在样式文件和脚本文件中。理想状态下，网页源代码由三部分组成：.html文件、.css文件和.js文件。标签中混有样式和行为的写法是不推荐的。
代码结构、样式和行为混杂的网页实现
<td width="100%" height="20" class="f9pt" align="center">
<font color="#346F0E">下载</font>
<input type=text name=wd size=40 onMouseOver=this.focus() onFocus=
this.select()style="margin-bottom:-5px;font-size:16px; height:1.78em;
font-family:arial,sans-serif,宋体;padding-top:2px; padding-left:
1px" maxlength=100>
</td>
这种段代码应该改成下面这样的形式
test.html文件：
<link rel="stylesheet" type="text/css" href="test.css" />
<td class="f9pt myTd">
<span class="myFont">下载</span>
<input type="text" name="wd" size="40" id="myInput"maxlength="100" />
</td>
<script type="text/Javascript" src="test.js"></script>
========================================================
test.css文件：
.myTd{width:100%;height:20px;text-align:center;}
.myFont{color:#346F0E;}
#myInput{margin-bottom:-5px;font-size:16px;height:
1.78em;font-family: arial,sans-serif,宋体;padding-top:2px;padding-left:1px}
========================================================
test.js文件
var myInput = document.getElementById("myInput");
myInput.onmouseover = function(){
this.focus();
}
myInput.onfocus = function(){
this.select();
}
- 如此一来，原来混乱不堪的HTML变得清爽多了。HTML标签只用负责承载内容，而样式交给了CSS，行为交给了JavaScript。
- 将结构、样式和行为分成三个文件，这是比较推荐的做法。但事实上，我们在工作中经常会因为各种原因而仍然把样式和行为放在.html文件中。即使是在这样的情况下，仍然可以将样式和行为从标签中分离出来。
- 如果不将CSS和JavaScript作为独立文件外链出去，而是在HTML页面里用<style>和<script>标签来承载样式和行为也是可以的，只要不在HTML标签上书写样式和行为，仍然实现了结构、样式和行为的分离。代码的职能已经非常非常清晰了，只是没有分开成三个文件而已。
