2013年03月14日 10:51:01
来源： 人民邮电报
作为新一代Web语言，HTML5凭借丰富应用、跨平台等特点被公认为未来网页技术的发展方向，并且被全球多家主流厂商寄予厚望。然而，在已经过去的一周， 风头正盛的HTML5却遭受了不小的打击。国外媒体爆料，HTML5在Cookie上的巨大漏洞，将可能短时间内挤爆用户的硬盘。这无疑是给支持HTML5的浏览器厂商泼了一盆冷水，也让用户对于HTML5少了一分“迷信”，多了一分理性。
HTML5漏洞遭曝光
3月4日，国外媒体的一则报道引发了广泛关注。美国22岁的开发者发现了HTML5的一个致命漏洞——大量的Cookie文件的产生将在很短的时间内挤爆用户的硬盘。据这位开发者解释，HTML5的标准中，可以允许网页在用户电脑中保存比过去多的自己定义数据（方式为Cookie）。过去每一个网站可以保存4KB的数据，而HTML5网站根据规范可以保存的数量为2.5MB~10MB不等。比如，用户每次登录Chrome会保存2.5MB的数据，火狐和Opera会保存5MB，而IE则会保存10MB。同时，根据HTML5的技术规范，网站的子域名在发生登录时，必须共享使用网站的Cookie数据保存空间（不得另开空间），可是Chrome、Safari、IE等浏览器没有遵守这一规则。
或许在很多人看来，如今的硬盘容量足够大，就算浏览器厂商不遵守规则，最终产生的数据量也根本算不了什么。然而令人意想不到的是，如果恶意网站进行精心编码，将会借此侵占用户全部的硬盘空间。根据曝光者进行的概念性攻击模型显示，仅仅需要16秒钟，海量的Cookie文件就占用了用户1GB的硬盘空间。这样的结果意味着，你的平板电脑或者手机的硬盘将因此而“挤爆”。
为了让业界更加重视HTML5存在的隐形安全问题，曝光者已经发布了一组代码来利用该漏洞，并专门创建了一个名为Filldisk的网站。同时，他还将此事件报告给了受到影响的浏览器开发商。不过值得一提的是，目前国内浏览器厂商360已经宣布，在第一时间修复了该漏洞，而用户只需升级浏览器版本就可以保证自己免受攻击。
HTML5的漫漫之路
虽然HTML5的漏洞修复工作已经展开，但是这件事情的发生还是给业界提了一个醒儿，作为一项刚刚兴起的技术，HTML5的安全问题需要给予更多关注，尽管早在2011年相关机构和组织就已经开始考虑HTML5的安全问题，并制定了一些技术规范，可是随着HTML5的普及和应用，更多的安全漏洞将出现。而只有充分暴露和修正，未来才能够有足够的安全。
其实，除了安全问题，HTML5的发展还存在诸多的挑战和障碍。3月12日的一则消息，让业界对于HTML5的发展又多了一份担忧。微软对外宣称，将在Windows RT和Windows 8默认启用Flash。对于这一改变，微软的解释是目前绝大多数的Flash内容网站开始兼容Metro下的触摸，使得触摸体验、性能和电池寿命都实现了极大改进，而业界看好并认为可能取代Flash的HTML5，却自2008年第一份草案正式公布后，发展十分缓慢，仍处于完善中。因此在HTML5产品并没有想象中发展那么迅猛的情况下，再加上Flash确实得到了优化，微软在IE10中默认启用Flash，有助于提高用户体验。
从2012年Facebook放弃HTML5，并放言“压宝HTML5是Facebook最大的错误”，到曾经高调支持HTML5的微软也不得不在IE10中默认启用Flash，再加上被媒体高度曝光的漏洞问题，HTML5的发展正在被投下更多的阴影。尤其是在目前标准尚未完善、市场博弈暗流涌动的情况下，人们不禁要对HTML5的未来打上问号。
不过，从长远看HTML5的优势仍然非常明显，主流厂商对其的支持也将发挥更大的作用，且不论HTML5和Flash是否将形成替代关系，HTML5对Web应用的丰富也终将使其在移动互联网时代展现更多“锋芒”。(黄舍予)
本文链接
翻译：veryhappy(wx.net)
ActiveX控件支持自定义程序接口。利用这种方法，外部可以访问控件的事件和属性，Web开发者可以自动操作他们的Web页面，等同于一般的桌面应用的功能。
介绍
作为一个Web应用程序开发者我们想提供给我们的用户具有更强功能的应用程序。我们想为用户通过脚本提供像打印流，本地Socket程序，本地线程这样功能的程序，但是正如我们所知由于任何标准浏览器出于Internet断连结构和安全约束，完成这样的任务十分困难。还好有了ActiveX带来了实现的可能。
用C#编写ActiveX类
先写一个包含所有方法属性定义的接口ASignatures。通过在浏览器中执行JavaScript来访问这些方法或属性。接口中所有成员是抽象并公开的。ActiveX类Aclass继承自这个接口。在ActiveX类上我们必须指名其ClassInterfaceType是AutoDal（*注：指示自动为类生成双重接口并向COM公开。为该类接口生成类型信息并在类库中发布）。一般AutoDual是不被推荐使用的因为它有版本限制。我们这里采用只是出于学习的目的。在类中我们写两个方法Fname()和Sname()和一个属性Age。在例子中返回基本数据类型，其实它也可以实现更复杂的数据类型。
using System.Runtime.InteropServices;
namespace ANamespace
{
public interface ASignatures
{
string FName();
string SName();
int Age { get;}
}
[ClassInterface(ClassInterfaceType.AutoDual)]
public class AClass :ASignatures
{
public string FName()
{
return "Very";
}
public string SName()
{
return "Happy";
}
public int Age
{
get { return 24; }
}
}
}
编译ActiveX控件
对那些不知道如何在Visual Studio IDE外编译的，你必需找到C#编译器 csc.exe在下列文件夹中：
/WINDOWS/Microsoft.NET/Framework/v2.0.xxxxx
把你的Aclass.cs文件在放在csc.exe这个文件夹中。进入命令行中执行如下命令：
csc /t:library AClass.cs
客户端注册组件
你可以通过多种途径注册组件。例如：创建安装文件或者自解压文件可以迅速的从浏览器中下载。我们的示例简单的在客户端命令行模式进行注册。在相同的文件夹下执行下面命令：
regasm AClass.dll /tlb /codebase
必须确定客户端已经安装了.NET Framework。
使用ActiveX控件
通过JavaScript创建ActiveX控件，调用方法和属性，返回的值显示在对话框中。下面代码告诉我们如何访问ActiveX控件的属性和方法。
<html>
<head>
<script language="javascript">
<!-- 读取 ActiveX 对象 -->
var x = new ActiveXObject("ANamespace.AClass");
<!-- 访问方法 -->
alert(x.FName());
alert(x.SName());
<!-- 访问属性 -->
alert(x.Age);
</script>
</head>
<body>
</body>
</html>
在Internet Explorer中运行（*注：需要在本地安全设置中启用“对未标记为可安全执行脚本的ActiveX初始化并执行脚本”），如果是FireFox或者Safari浏览器则需要API的插件。
总结
在这篇文章中，我们知道如何通过C#编写的ActiveX控件来增强Web应用的功能。实际的ActiveX程序可以实现更复杂的应用，尤其是图形和多媒体。
在讲解本次课程前：我们先来看下什么是浏览器：
所谓浏览器就是可以解释和执行HTML代码的工具。还有一个概念我们需要搞清楚，浏览器！=IE，IE只是浏览器当中的一种。除了IE还有N多浏览器，google一把，就可以知道。我们就不再赘述了。
首先我们来了解下什么是HTML
HTML全称：Hyper Text Mark-up Language（超文本标记语言）。就是描述网页长相以及网页内容的文本。HTML之所以能展现出各种各样的效果，是浏览器的功能。
补充内容：这里我们再来扩充一些内容，就是相同的HTML文本，在不浏览器上，效果可能不一样。这是因为先出现了多个浏览器，然后才有了对应的标准。鉴于这种情况，我们可以使用IETester来测试相同的HTML代码在不同浏览器上的兼容性问题。
2，静态页面和动态页面
还有一点我们需要知道，静态页面和动态页面的区别。
首先，网站的页面分为静态页面和动态页面两种。
静态页面：后缀为html或者htm的都是静态页面，在服务器上有一个固定的html页面
动态页面：服务器上没有用户需要浏览的页面，但是服务器可以动态生成客户所需的html页面，然后展现给客户。
用一句话概括两者的区别：动态页面执行服务器端代码，静态页面不会执行服务器端代码（现在大家先了解下就ok，毕竟静态页面是咱们今天的讨论重点）
3．如何书写一个HTML页面？
书写HTML有多种工具，相信记事本大家都知道，用记事本就可以书写HTML页面。当然是用EditPlus/UltraEdit等高级记事本也可以书写，还可以是用Dreamweaver等工具。
下图是一个HTML网页基本结构
通过上图可以看出，所有内容都在<html></html>标签之内；<head></head>内放的是头部信息，对页面的描述，该内容不会显示在页面中。<title></title>中设置的是页面的标题，<title>只能放到<head>中；<body></body>是页面的主体，该标签内的文本会在网页上显示。当然所有页面至少应包含这些部分。
提示：title标签的结束标签如果没有闭合，则整个页面都不显示。
4.HTML和XML的异同点
相同点：都是标记语言，都可以通过dom方式访问，都可通过css来改变外观
不同点：
5.xhtml和dhtml
Xhtml：可扩展标记语言，是更符合xml语法规范的html。Xhtml的出现主要是为了向xml过渡。Xhtml要求：全部小写、标签配对、属性用双引号。
dhtml： Dynamic HTML的简称，就是动态的html。 HTML、样式表和JavaScript 的组合
补充：Web标准不是一个标准，而是一系列标准的集合。
网页由三部组成：结构，表现和行为
结构：文字、图片等 对应语言：xml,xhtml
表现：也称为样式，如文字大小和颜色等，这些也都是通过样式来实现的。css
行为：客户端的动态效果，一般通过javascript来完成。DOM，ECMAScript
接下来咱们进入正题：学习html常用标签。
6.html标签
01，h标签（标题），HTML定义了<h1></h1>到<h6></h6>六个h标签，分别表示不同大小的字体。h1最大，h6最小。
02, <br/>只是回车，是自身闭合的标签
03, <p>是分段。<p>前后会有比较大的空白，而<br/>则没有。
04, <center>居中</center>居中显示.(不推荐使用)
05, <b>a</b>粗体，推荐<strong>。<i>b</i>斜体。<u>c</u>带下划线。<em>强调，斜体</em>
06, <font></font>字体标签，<font color=“red“ size=“7” face=“隶书”>红色</font>
07,<hr> 水平线 常用属性：color size（厚度） width（长度） align=left/center/right （默认为剧中显示）
7.html特殊字符
" "
& &
< <
> >
空格
© ©
® ®
² ²
¥ ¥
³ ³
8.图像格式扩展
9.图像标签：<img alt=”无法显示时提示文本”>
Alt:无法显示图片时的提示文本。
10.超链接：
href指出要连接的目标页面，target指向目标窗口为值，取值
_blank :在新窗口中打开
_self :在自己的窗口中打开
_parent :父窗口中打开
_top :表示在顶级窗口打开
框架名称：在指定框架中打开。(了解)
锚链接：01设置锚的位置
<a name="showBigImg"><img src="/blog_article/image/02.jpg"></a>
02.调用锚
<a href="#showBigImg">看美女图片</a>
11.Html中的列表：
分为无序列表，有序列表和定义列表
下面我们看下各种列表的显示效果图
无序列表：
<ul>
<li></li>
<li></li>
</ul>
有序列表
<ol>
<li></li>
<li></li>
</ol>
定义列表：
<dl>
<dt>中国</dt>
<dd>上海</dd>
<dd>广州</dd>
<dd>北京</dd>
</dl>
type的取值可以是：1、a、A、i、I、disc、circle、square。
12.表格：显示规整的数据，有时也用于布局。
从上图可以看出，表格由行和列组成，行用tr表示，列用td表示。还可以使用rowspan(合并行)、colspan（和并列）进行单元格的合并。
练习一：用html代码输出一下表格
练习2:表格的跨行和跨列
13.表单
action默认向本页提交数据
如果要把数据提交到服务器，则需要将<input>、<textarea>、<select>等表单元素放到form中。Input的类型取值如下：
Checked属性是为单选按钮和复选框准备的
单选按钮用于一组相互排斥的值，效果图如下
复选框效果图如下
按钮主要有三种：提交按钮，重置按钮和普通按钮