YIXUNFE commented 8 years ago

HTA, HTML Application

这年头，前端框架不支持移动原生应用开发都会让人觉得奇怪了。而使用前端技术开发桌面应用更是很早就有。大名鼎鼎的 node-webkit 就是其中一员。而我们今天要讲的，是 node-webkit 的爷爷辈老物 —— HTA，HTML 应用程序。

Hello world

编写 HTA 格外的简单，用一个文本文档，写上几句 HTML 语句，保存为 .hta 格式，双击即可运行。

<div>Hello world</div>

000

我们再来添加一些样式试试：

<style>.red {color: red}</style>
<div class=“red”>Hello world</div>

111

HTA 也支持 JS 脚本（VBScript，JScript）：

<style>.red {color: red}</style>
<div class=“red”>Hello world</div>
<script>document.write('Wooo')</script>

222

既然是应用程序，应该是可以自己设定外观的，比如边框样式、应用程序图标、窗口最小化按钮等。这些设置都可以通过 <HTA:Application> 标签设置。

我来看个实例，将应用程序的边框去除：

<HTA:Application
  border="none"
>

因为去除边框后应用程序的最大化、最小化、关闭按钮就会一起消失，所以我们在页面中添加一个关闭按钮，可以防止程序无法从界面上被关闭。

<div onclick="self.close()">关闭</div>

3330

属性名	描述
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

在 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 对象。今天就讲到这里，拜拜哦。

yutingzhao1991 commented 8 years ago

张姿势了原来还有这玩意。

cssmagic commented 8 years ago

Windows + Office + IE，以及底层的一堆技术，是一盘很大的棋呀。