星期六, 三月 13, 2004

InLine Image HTML 实现(二),如何在HTML页面里嵌入图片数据?

William按:当初想到为为什么不可以在HTML里面直接嵌入图片数据呢?非要用link引用的方式呢?不方便发送,也不方便保存。
最终找到了部分实现的方法,可惜丑陋的M$的IE,不支持HTML4。0的规范,BT.但可爱的Mozilla和FIreFox支持.:).
--
理论:<IMG SRC="">是通过link URL的方式获得图片资源,不过现在HTML 4。0支持:data协议。
<IMG SRC="data:....">
另外Mozilla也支持Pipeline的方式获取数据。从这里可以看出良好的API设计的重要了。否则一个模块的功能的扩展性非常差。Mozilla的HTML Rengine是在资源上加了一层Pipeline的抽象,通过chian filter的模式来匹配最终的负责render,进行这样渲染rende的都是符合某钟合格数据流。这样一下子是API的灵活性极大加强了,而IE的HTML render Enginne是死板的switch("GIF89a")类似的方式写的代码,扩展性极差,怪不得要经常升级和打补丁呢。愚昧啊,愚昧。丑陋战胜了先进.
这种Inline Image支持的图片长度有限,最少或最多是1k的图片,不过我这个可不只1K,也可以。当然页勉里面嵌入数据,最好只放在个人简介里,否则,可要给访问网站的骂的心惊肉跳了。

实现部分:
1.<IMG SRC="data:...">
2.<IMG SRC="javascript:imagedata">
<html>
<body>
<script>

var hexdata='[\x...]';//这里是存放InLineImage工具生成的GIF87a格式数据

</script>
a<br>
<img src="javascript:hexdata;">//Javascript PipeLine数据管道实现
<p><IMG SRC="data:image/gif;base64,[..base64 data]" ALT="Larry"/>
</body>
</html>

--------



a