HTA, HTML Application
YIXUNFE opened this issue · comments
易迅前端团队 commented
HTA, HTML Application
这年头,前端框架不支持移动原生应用开发都会让人觉得奇怪了。而使用前端技术开发桌面应用更是很早就有。大名鼎鼎的 node-webkit 就是其中一员。而我们今天要讲的,是 node-webkit 的爷爷辈老物 —— HTA,HTML 应用程序。
## Hello world
编写 HTA 格外的简单,用一个文本文档,写上几句 HTML 语句,保存为 .hta
格式,双击即可运行。
<div>Hello world</div>
我们再来添加一些样式试试:
<style>.red {color: red}</style>
<div class=“red”>Hello world</div>
HTA 也支持 JS 脚本(VBScript,JScript):
<style>.red {color: red}</style>
<div class=“red”>Hello world</div>
<script>document.write('Wooo')</script>
## HTA:Application 标签
既然是应用程序,应该是可以自己设定外观的,比如边框样式、应用程序图标、窗口最小化按钮等。这些设置都可以通过 <HTA:Application>
标签设置。
我来看个实例,将应用程序的边框去除:
<HTA:Application
border="none"
>
因为去除边框后应用程序的最大化、最小化、关闭按钮就会一起消失,所以我们在页面中添加一个关闭按钮,可以防止程序无法从界面上被关闭。
<div onclick="self.close()">关闭</div>
### HTA:Application 标签中的属性列表
属性名 | 描述 |
---|---|
applicationname | 设置HTA的名称 |
border | 设置边框类型,可选值有 thick ,dialog window ,none ,thin |
border-style | 设置边框样式,可选值有 normal ,complex ,raised ,static ,sunken |
caption | 设置是否显示标题栏或标题,默认值为 yes |
icon | 设置应用程序的图标 |
maximizebutton | 设置是否显示最大化按钮,默认值为 yes |
minimizebutton | 设置是否显示最小化按钮,默认值为 yes |
showIntaskbar | 设置是否在任务栏中显示此应用程序,默认值为 yes |
singleInstance | 设置是否此应用程序同时只能运行一次,默认值为 no |
sysmenu | 设置是否在HTA窗口中显示系统菜单,默认值为 yes |
version | 应用程序的版本 |
windowstate | 设置窗口的初始大小,可选值有 normal ,minimize ,maximize |
scroll | 设置是否在右端显示竖向滚动条,默认值为 yes |
## 结合 ActiveX 对象
在 HTA 中的复杂操作都离不开 ActiveX 对象,它提供了读写文件、访问数据库、调用其他程序等等功能。
这里我们尝试用 HTA 调出一个 notepad
程序。
<a onclick="callNotepad()">call notepad</a>
function callNotepad () {
var shell = new ActiveXObject("WScript.Shell")
shell.Run('notepad.exe', 3, true)
shell = null
}
想要制作一个功能强大的 HTA 应用就离不开 ActiveX 对象。今天就讲到这里,拜拜哦。
## 参考文章
【经验分享】本地脚本工具 -- Html Application
## Thanks
愚指导 commented
张姿势了 原来还有这玩意。
CSS魔法 commented
Windows + Office + IE,以及底层的一堆技术,是一盘很大的棋呀。